
/*
FILE: web/css/runtime_index_flow_card_middle_text_small_v18_64.css
ROLE: homepage 6 flow cards middle text smaller
STATUS: active patch v18.64
DOES:
- makes the middle/subtitle text inside the 6 homepage flow cards smaller
- targets examples like "Cerere privata standard", "Cerere privata urgenta", "Cerere partener privat"
- keeps card titles and buttons readable
DOES NOT:
- touch backend, database, auth logic, submit logic, sessions, storage
*/

/* Homepage flow card middle text only. */
body[data-page="index"] :is(
  .home-route-card,
  .home-flow-card,
  .flow-route-card,
  .flow-card,
  .abc-flow-card,
  [data-flow-type],
  [data-route-family],
  [data-account-flow]
) :is(
  p,
  .card-subtitle,
  .flow-card-subtitle,
  .card-description,
  .flow-card-description,
  .route-card-subtitle,
  .route-card-description,
  .flow-description,
  [data-flow-card-subtitle],
  [data-card-middle-text]
){
  font-size: clamp(12px, .95vw, 15px) !important;
  line-height: 1.12 !important;
  font-weight: 650 !important;
  margin: 0 0 6px 0 !important;
  padding: 0 !important;
  letter-spacing: 0 !important;
}

/* If the middle text is rendered as h2/h3 in old markup, reduce only the second/inner heading,
   while leaving the first card title stronger. */
body[data-page="index"] :is(
  .home-route-card,
  .home-flow-card,
  .flow-route-card,
  .flow-card,
  .abc-flow-card,
  [data-flow-type],
  [data-route-family],
  [data-account-flow]
) :is(h2,h3):not(:first-child){
  font-size: clamp(13px, 1.05vw, 16px) !important;
  line-height: 1.12 !important;
  font-weight: 700 !important;
  margin: 0 0 6px 0 !important;
}

/* Safety for exact common flow middle labels if they are plain blocks/spans. */
body[data-page="index"] :is(
  .home-route-card,
  .home-flow-card,
  .flow-route-card,
  .flow-card,
  .abc-flow-card,
  [data-flow-type],
  [data-route-family],
  [data-account-flow]
) :is(
  .middle-text,
  .flow-middle-text,
  .card-middle-text,
  .request-type-text,
  .request-label,
  .flow-label
){
  font-size: clamp(12px, .95vw, 15px) !important;
  line-height: 1.12 !important;
  font-weight: 650 !important;
}

/* Button text stays normal, not affected by subtitle shrink. */
body[data-page="index"] :is(
  .home-route-card,
  .home-flow-card,
  .flow-route-card,
  .flow-card,
  .abc-flow-card,
  [data-flow-type],
  [data-route-family],
  [data-account-flow]
) :is(a,button,.button,.btn){
  font-size: clamp(13px, 1vw, 16px) !important;
  line-height: 1.1 !important;
}

/* Mobile: middle text still readable but compact. */
@media (max-width:760px){
  body[data-page="index"] :is(
    .home-route-card,
    .home-flow-card,
    .flow-route-card,
    .flow-card,
    .abc-flow-card,
    [data-flow-type],
    [data-route-family],
    [data-account-flow]
  ) :is(
    p,
    .card-subtitle,
    .flow-card-subtitle,
    .card-description,
    .flow-card-description,
    .route-card-subtitle,
    .route-card-description,
    .flow-description,
    .middle-text,
    .flow-middle-text,
    .card-middle-text,
    .request-type-text,
    .request-label,
    .flow-label,
    [data-flow-card-subtitle],
    [data-card-middle-text]
  ){
    font-size: 12px !important;
    line-height: 1.12 !important;
  }
}
