/* ================================================================
   TC1241 — WCAG 2.5.5 Touch Targets ≥44×44px (mobile-only)
   Creat: 2026-04-29 | Agent: sonnet-tc1241
   Regula: NUMAI @media (max-width: 767px) — desktop UX neafectat
   NU modifica culori/borders — doar dimensiuni și spacing
   ================================================================ */

/* ── Global touch-target variable: definit în css/design_system.css :root ── */
/* :root { --touch-target-min: 44px; } ← SSoT în design_system.css */

/* ================================================================
   MOBILE-ONLY FIXES (@media max-width: 767px)
   ================================================================ */

@media (max-width: 767px) {

  /* ── 1. BTN-ICON (sidebar collapse, theme switch, notification, help) ──
     Actual: 40×40px → Target: ≥44×44px
     Folosim min-width/min-height pentru a nu sparge layout-uri flex */
  .btn-icon {
    min-width: var(--touch-target-min) !important;
    min-height: var(--touch-target-min) !important;
  }

  /* Theme toggle button — actual: ~28px (padding:5px 9px → ~28px înălțime) */
  .tt-theme-btn {
    min-height: var(--touch-target-min);
    min-width: var(--touch-target-min);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 12px;
  }

  /* Notification/help icon-only buttons în topbar (p-2 → ~36px) */
  header button,
  .topbar button,
  #topbar button {
    min-width: var(--touch-target-min);
    min-height: var(--touch-target-min);
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  /* ── 2. SIDEBAR ITEMS (py-2.5 + text → ~36px) ── */
  .sidebar-item,
  .menu-item {
    min-height: var(--touch-target-min);
    display: flex;
    align-items: center;
  }

  /* ── 3. TAB PILLS — toate variantele (py-2 → ~32px înălțime) ──
     inbox-tab-btn, mkt-tab-btn, profil-tab-btn, cad-tab-btn,
     profile-tab-btn, settings-tab-btn */
  .inbox-tab-btn,
  .mkt-tab-btn,
  .profil-tab-btn,
  .cad-tab-btn,
  .profile-tab-btn,
  .settings-tab-btn,
  [class*="-tab-btn"] {
    min-height: var(--touch-target-min);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  /* ── 4. PAGINATION BUTTONS (py-1 → ~24-28px) ──
     Butoanele generate dinamic în #registru-pagination și #kb-browse-pagination */
  #registru-pagination button,
  #kb-browse-pagination button,
  [id$="-pagination"] button,
  .pagination button,
  .pager button {
    min-width: var(--touch-target-min);
    min-height: var(--touch-target-min);
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  /* ── 5. MODAL CLOSE BUTTONS (×) — actual: p-2 → ~32-36px ── */
  .modal-close-btn,
  .docgen-btn-close,
  [id$="-close"],
  [id$="-close-btn"],
  button[aria-label="Închide"],
  button[aria-label="Close"],
  button[title="Închide"],
  button[title="Close"] {
    min-width: var(--touch-target-min);
    min-height: var(--touch-target-min);
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  /* ── 6. GLOBAL BUTTON VARIANTS (btn-primary/secondary/ghost/danger) ──
     btn-sm: padding:4px 10px → ~24px înălțime pe mobile → fix */
  .btn-primary,
  .btn-secondary,
  .btn-ghost,
  .btn-danger {
    min-height: var(--touch-target-min);
  }

  /* btn-sm specific override — pe mobile ridicăm la 44px minim */
  .btn-sm {
    min-height: var(--touch-target-min);
    padding-top: 10px;
    padding-bottom: 10px;
  }

  /* ── 7. FORM CONTROLS — select, input (py-1/py-1.5 → ~30px) ── */
  select,
  input[type="text"],
  input[type="email"],
  input[type="search"],
  input[type="password"],
  input[type="number"],
  input[type="tel"],
  textarea {
    min-height: var(--touch-target-min);
  }

  /* ── 8. NAV BOTTOM MOBILE (nav-btn-mobile) ── */
  .nav-btn-mobile {
    min-height: var(--touch-target-min);
    min-width: 48px; /* slightly wider for bottom nav */
  }

  /* ── 9. DASH EDIT BTN (6px 14px → ~28px) ── */
  .dash-edit-btn {
    min-height: var(--touch-target-min);
    padding-top: 10px;
    padding-bottom: 10px;
  }

  /* ── 10. BURGER BTN — deja are min-height:44px în index.html inline CSS ──
     Confirmăm via regulă generală */
  #burger-btn {
    min-width: var(--touch-target-min);
    min-height: var(--touch-target-min);
  }

} /* end @media (max-width: 767px) */

/* ================================================================
   END TC1241
   ================================================================ */
