/* TT24 Mobile Hard Fix - 1405
   هدف: موبایل بدون زوم، بدون اسکرول افقی، سبک و اپلیکیشنی.
   دسکتاپ تقریباً بدون تغییر می‌ماند. */

:root{
  --tt24-mobile-pad: 12px;
  --tt24-mobile-radius: 18px;
  --tt24-mobile-header: 64px;
  --tt24-mobile-bottom: env(safe-area-inset-bottom, 0px);
}

html{
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body{
  max-width:100vw;
  overflow-x:hidden !important;
}

*{ box-sizing:border-box; }
img, svg, video, canvas{ max-width:100%; height:auto; }

/*
 * TT24 mobile drawer dismissal/contrast fix (2026-09-27).
 * app.css collapses the shell at 880px, so the backdrop and drawer state must
 * use the same breakpoint instead of the narrower 820px content breakpoint.
 */
.mobile-menu-backdrop{ display:none; }

@media (max-width: 880px){
  body.mobile-menu-open{ overflow:hidden !important; }

  body .mobile-menu-backdrop{
    position:fixed;
    inset:0;
    background:rgba(15,23,42,.52);
    z-index:10020;
    backdrop-filter:blur(2px);
  }
  body.mobile-menu-open .mobile-menu-backdrop{ display:block; }
  body.mobile-menu-open .sidebar{ transform:translateX(0) !important; }

  /* Palette sidebars are dark; pin readable foregrounds in light, dark and PWA modes. */
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .sidebar-head .t,
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .nav-item,
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .nav-parent,
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .user-chip .nm{
    color:#f8fafc !important;
  }
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .sidebar-head .s,
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .nav-sep,
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .nav-item.nav-sub,
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .user-chip .rl{
    color:rgba(248,250,252,.72) !important;
  }
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .nav-item .ico{
    color:rgba(248,250,252,.68) !important;
  }
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .nav-item:hover,
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .nav-item.active{
    color:#fff !important;
    background:rgba(255,255,255,.13) !important;
  }
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .nav-item:hover .ico,
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .nav-item.active .ico{
    color:#fde68a !important;
  }
  html[data-tt24-palette] body .tt24-d2-shell .sidebar .user-chip{
    background:rgba(255,255,255,.09) !important;
    border-color:rgba(255,255,255,.16) !important;
  }
}

/* فقط موبایل و تبلت کوچک */
@media (max-width: 820px){
  html, body{
    width:100% !important;
    max-width:100vw !important;
    min-width:0 !important;
    overflow-x:hidden !important;
    overscroll-behavior-x:none;
    background:#f4f7fb;
  }

  body.tt24-mobile .app,
  body.tt24-mobile #app,
  body.tt24-mobile .app-shell,
  body.tt24-mobile .layout,
  body.tt24-mobile .main,
  body.tt24-mobile .main-content,
  body.tt24-mobile .content,
  body.tt24-mobile .page,
  body.tt24-mobile .page-content,
  body.tt24-mobile .dashboard,
  body.tt24-mobile .container,
  body.tt24-mobile .wrap,
  body.tt24-mobile main{
    width:100% !important;
    max-width:100vw !important;
    min-width:0 !important;
    margin-right:0 !important;
    margin-left:0 !important;
    padding-right:var(--tt24-mobile-pad) !important;
    padding-left:var(--tt24-mobile-pad) !important;
    overflow-x:hidden !important;
  }

  body.tt24-mobile .content,
  body.tt24-mobile .main-content,
  body.tt24-mobile main{
    padding-top:10px !important;
  }

  /* جلوگیری از کشیده شدن کل صفحه توسط آیتم‌های ثابت */
  body.tt24-mobile [style*="width:"]{
    max-width:100% !important;
  }

  /* TT24_ASIDE_NOT_DRAWER_V1 (2026-10-03): the dashboard's side cards are an <aside class="tt24-d1-side-stack">; the bare
     `aside` selector turned them into a second off-canvas drawer that slid over the real menu. */
  body.tt24-mobile .sidebar,
  body.tt24-mobile aside:not(.tt24-d1-side-stack),
  body.tt24-mobile .side-menu{
    position:fixed !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:min(82vw, 320px) !important;
    max-width:min(82vw, 320px) !important;
    transform:translateX(105%);
    transition:transform .22s ease;
    z-index:10030 !important;
    overflow-y:auto !important;
    border-radius:0 !important;
  }
  body.tt24-mobile.mobile-menu-open .sidebar,
  body.tt24-mobile.mobile-menu-open aside:not(.tt24-d1-side-stack),
  body.tt24-mobile.mobile-menu-open .side-menu{
    transform:translateX(0) !important;
  }

  body.tt24-mobile .mobile-menu-backdrop{
    display:none;
    position:fixed;
    inset:0;
    background:rgba(15,23,42,.44);
    z-index:10020;
    backdrop-filter:blur(2px);
  }
  body.tt24-mobile.mobile-menu-open .mobile-menu-backdrop{ display:block; }

  /* هدر موبایل */
  body.tt24-mobile .topbar,
  body.tt24-mobile .header,
  body.tt24-mobile .page-header,
  body.tt24-mobile .app-header{
    width:100% !important;
    max-width:100vw !important;
    min-height:56px !important;
    padding:8px 12px !important;
    margin:0 !important;
    position:relative;
    overflow:visible !important;
  }

  body.tt24-mobile .topbar h1,
  body.tt24-mobile .header h1,
  body.tt24-mobile .page-title,
  body.tt24-mobile h1{
    font-size:20px !important;
    line-height:1.5 !important;
    white-space:normal !important;
    max-width:calc(100vw - 110px) !important;
  }

  /* دکمه‌های شناور بالا مثل زنگ/ماه نباید روی محتوا بیفتند */
  body.tt24-mobile .floating-actions,
  body.tt24-mobile .quick-actions,
  body.tt24-mobile .top-actions,
  body.tt24-mobile .header-actions{
    display:flex !important;
    gap:8px !important;
    align-items:center !important;
    flex-wrap:nowrap !important;
    max-width:100% !important;
    position:relative !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    margin:6px 0 !important;
    z-index:20 !important;
  }

  body.tt24-mobile .floating-actions .btn,
  body.tt24-mobile .quick-actions .btn,
  body.tt24-mobile .top-actions .btn,
  body.tt24-mobile .header-actions .btn,
  body.tt24-mobile .icon-btn{
    width:46px !important;
    height:46px !important;
    min-width:46px !important;
    border-radius:16px !important;
  }

  /* بنر برند در موبایل کوتاه و بدون بیرون‌زدگی */
  body.tt24-mobile .brand-hero,
  body.tt24-mobile .hero,
  body.tt24-mobile .welcome-card,
  body.tt24-mobile .brand-card,
  body.tt24-mobile .dashboard-hero{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:auto !important;
    min-height:92px !important;
    margin:10px 0 14px !important;
    padding:14px !important;
    border-radius:20px !important;
    overflow:hidden !important;
    background-size:cover !important;
    background-position:center !important;
  }
  body.tt24-mobile .brand-hero img,
  body.tt24-mobile .hero img,
  body.tt24-mobile .brand-card img,
  body.tt24-mobile .dashboard-hero img{
    max-height:58px !important;
    width:auto !important;
  }
  body.tt24-mobile .brand-hero h2,
  body.tt24-mobile .hero h2,
  body.tt24-mobile .brand-card h2,
  body.tt24-mobile .dashboard-hero h2{
    font-size:18px !important;
    white-space:normal !important;
    max-width:100% !important;
  }

  /* کارت‌ها و سکشن‌ها */
  body.tt24-mobile .card,
  body.tt24-mobile .panel,
  body.tt24-mobile .box,
  body.tt24-mobile .section,
  body.tt24-mobile .glass,
  body.tt24-mobile .widget{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:10px 0 !important;
    padding:14px !important;
    border-radius:20px !important;
    overflow:hidden !important;
  }

  body.tt24-mobile h2,
  body.tt24-mobile h3,
  body.tt24-mobile .section-title{
    font-size:19px !important;
    line-height:1.7 !important;
    margin:8px 0 12px !important;
  }

  body.tt24-mobile .muted,
  body.tt24-mobile .help,
  body.tt24-mobile .hint,
  body.tt24-mobile .description,
  body.tt24-mobile .section-desc,
  body.tt24-mobile .page-subtitle{
    font-size:12px !important;
    line-height:1.8 !important;
  }

  /* گریدها تک‌ستونه شوند */
  body.tt24-mobile .grid,
  body.tt24-mobile .cards,
  body.tt24-mobile .stats,
  body.tt24-mobile .dashboard-grid,
  body.tt24-mobile .form-grid,
  body.tt24-mobile .filters,
  body.tt24-mobile .toolbar,
  body.tt24-mobile .actions-row{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }

  body.tt24-mobile .stats .card,
  body.tt24-mobile .stat-card,
  body.tt24-mobile .summary-card{
    min-height:auto !important;
    padding:14px !important;
  }

  /* ورودی‌ها و دکمه‌ها */
  body.tt24-mobile input,
  body.tt24-mobile select,
  body.tt24-mobile textarea,
  body.tt24-mobile button,
  body.tt24-mobile .btn{
    max-width:100% !important;
    min-width:0 !important;
    font-size:15px !important;
  }
  body.tt24-mobile input,
  body.tt24-mobile select,
  body.tt24-mobile textarea{
    width:100% !important;
    height:48px !important;
    border-radius:14px !important;
  }
  body.tt24-mobile textarea{ height:auto !important; min-height:96px !important; }
  /* ui-e2e: رادیو/چک‌باکس نباید مثل فیلد متنی تمام‌عرض و ۴۸px شوند (برچسب کنارشان می‌شکست) */
  body.tt24-mobile input[type="radio"],
  body.tt24-mobile input[type="checkbox"]{ width:20px !important; min-width:20px !important; height:20px !important; min-height:0 !important; flex:0 0 auto !important; padding:0 !important; }

  body.tt24-mobile .btn,
  body.tt24-mobile button{
    min-height:44px !important;
    border-radius:14px !important;
    padding:10px 14px !important;
  }

  /* فرم ورود: جلوگیری از خروج دکمه ارسال کد از صفحه */
  body.tt24-mobile .auth-card,
  body.tt24-mobile .login-card,
  body.tt24-mobile .auth-box{
    width:calc(100vw - 24px) !important;
    max-width:420px !important;
    margin:18px auto !important;
    padding:18px !important;
    border-radius:22px !important;
    overflow:hidden !important;
  }
  body.tt24-mobile .otp-row,
  body.tt24-mobile .phone-row,
  body.tt24-mobile .input-with-button{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    width:100% !important;
  }
  body.tt24-mobile .otp-row button,
  body.tt24-mobile .phone-row button,
  body.tt24-mobile .input-with-button button{
    width:100% !important;
  }

  /* جدول‌ها: در موبایل به کارت تبدیل می‌شوند */
  body.tt24-mobile table{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    border-collapse:separate !important;
    border-spacing:0 10px !important;
  }
  body.tt24-mobile thead{ display:none !important; }
  body.tt24-mobile tbody,
  body.tt24-mobile tr,
  body.tt24-mobile td{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
  }
  body.tt24-mobile tr{
    background:#fff !important;
    border:1px solid #dbe6f4 !important;
    border-radius:18px !important;
    padding:10px 12px !important;
    box-shadow:0 10px 24px rgba(15,23,42,.06) !important;
    overflow:hidden !important;
  }
  body.tt24-mobile td{
    border:0 !important;
    padding:8px 0 !important;
    text-align:right !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
  }
  body.tt24-mobile td::before{
    content:attr(data-label);
    display:block;
    color:#64748b;
    font-size:12px;
    font-weight:700;
    margin-bottom:4px;
  }
  body.tt24-mobile td:empty{ display:none !important; }

  /* اگر لیست‌ها از div ساخته شده باشند */
  body.tt24-mobile .list-row,
  body.tt24-mobile .file-row,
  body.tt24-mobile .document-row,
  body.tt24-mobile .case-row,
  body.tt24-mobile .invoice-row{
    width:100% !important;
    max-width:100% !important;
    display:block !important;
    padding:12px !important;
    margin:10px 0 !important;
    border-radius:18px !important;
    overflow:hidden !important;
  }

  /* بخش اسناد در موبایل سبک شود */
  body.tt24-mobile [data-page="documents"] .help,
  body.tt24-mobile [data-page="documents"] .section-desc,
  body.tt24-mobile #documents .help,
  body.tt24-mobile #documents .section-desc,
  body.tt24-mobile .documents-page .help,
  body.tt24-mobile .documents-page .section-desc{
    display:none !important;
  }

  /* داشبورد پرونده‌ها: کارت‌ها نباید از چپ بیرون بزنند */
  body.tt24-mobile .current-files,
  body.tt24-mobile .files-list,
  body.tt24-mobile .cases-list,
  body.tt24-mobile .dashboard-files{
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
  }
  body.tt24-mobile .current-files > *,
  body.tt24-mobile .files-list > *,
  body.tt24-mobile .cases-list > *,
  body.tt24-mobile .dashboard-files > *{
    max-width:100% !important;
  }

  /* مودال‌ها تمام صفحه و قابل استفاده */
  body.tt24-mobile .modal,
  body.tt24-mobile .modal-dialog,
  body.tt24-mobile .dialog,
  body.tt24-mobile .popup{
    width:100vw !important;
    max-width:100vw !important;
    height:100dvh !important;
    max-height:100dvh !important;
    margin:0 !important;
    border-radius:0 !important;
    inset:0 !important;
  }
  body.tt24-mobile .modal-content,
  body.tt24-mobile .modal-card{
    width:100% !important;
    max-width:100vw !important;
    height:100dvh !important;
    max-height:100dvh !important;
    border-radius:0 !important;
    display:flex !important;
    flex-direction:column !important;
  }
  body.tt24-mobile .modal-b,
  body.tt24-mobile .modal-body{
    flex:1 1 auto !important;
    overflow:auto !important;
    padding:14px !important;
  }
  body.tt24-mobile .modal-footer,
  body.tt24-mobile .modal-actions{
    padding:10px 14px calc(10px + var(--tt24-mobile-bottom)) !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
  }

  /* نوتیف و prompt نصب */
  body.tt24-mobile .pwa-install-prompt,
  body.tt24-mobile .notification-center,
  body.tt24-mobile .toast,
  body.tt24-mobile .dropdown-menu{
    max-width:calc(100vw - 20px) !important;
    width:calc(100vw - 20px) !important;
    right:10px !important;
    left:10px !important;
  }

  /* جلوگیری از بیرون‌زدگی متن‌ها */
  body.tt24-mobile p,
  body.tt24-mobile span,
  body.tt24-mobile div,
  body.tt24-mobile a,
  body.tt24-mobile strong{
    overflow-wrap:anywhere;
  }

  /* TT24_MOBILE_D1_KPI_NUMBER_FIX_V1: بزرگ/پررنگ‌بودن عدد شاخص («کل پرونده‌ها» و مشابه) قبلاً فقط
     داخل @media (min-width:769px) در tt24-d1-dashboard.css تعریف شده بود -- زیر آن آستانه (یعنی روی
     هر گوشی واقعی) این <strong> هیچ Rule اختصاصی نداشت و به‌صورت inline/پیش‌فرض مرورگر (~14px، بدون
     تاکید بصری) نمایش داده می‌شد؛ همان عددی که در دسکتاپ بزرگ‌ترین و اولین چیزی است که چشم می‌بیند،
     در موبایل تقریباً گم می‌شد. */
  body.tt24-mobile .tt24-d1-kpi strong{
    display:block !important;
    margin-top:10px !important;
    font-size:26px !important;
    line-height:1 !important;
    font-weight:900 !important;
    letter-spacing:-.5px !important;
  }
}

/* موبایل خیلی باریک */
@media (max-width: 390px){
  :root{ --tt24-mobile-pad:10px; }
  body.tt24-mobile .card,
  body.tt24-mobile .panel,
  body.tt24-mobile .box,
  body.tt24-mobile .section{
    padding:12px !important;
    border-radius:18px !important;
  }
  body.tt24-mobile h1{ font-size:18px !important; }
  body.tt24-mobile h2, body.tt24-mobile h3{ font-size:17px !important; }
  body.tt24-mobile .btn, body.tt24-mobile button{ font-size:14px !important; }
}

/* TT24_STAGE42_GLOBAL_MOBILE_FOCUS_V1_START */
/*
 * Global mobile focus safety:
 * - Prevent iOS focus auto-zoom by keeping editable controls at >=16 CSS px.
 * - Preserve manual pinch zoom; viewport is intentionally unchanged.
 * - Prevent double-tap zoom on interactive controls with touch-action: manipulation.
 * - Keep dynamic forms and modals within their parent width.
 */
@media (max-width: 1024px), (hover: none) and (pointer: coarse) {
  html {
    -webkit-text-size-adjust: 100% !important;
    text-size-adjust: 100% !important;
  }

  input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
  select,
  textarea,
  [contenteditable="true"],
  [contenteditable="plaintext-only"] {
    font-size: 16px !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  button,
  .btn,
  a,
  [role="button"],
  summary,
  label[for],
  input,
  select,
  textarea,
  [contenteditable="true"],
  [contenteditable="plaintext-only"] {
    touch-action: manipulation;
  }

  form,
  fieldset,
  .field-grid,
  .form-grid,
  .modal,
  .modal-b,
  .modal-f,
  #content,
  .content {
    min-width: 0 !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}
/* TT24_STAGE42_GLOBAL_MOBILE_FOCUS_V1_END */

/* TT24_MOBILE_FULL_WIDTH_AND_MESSAGE_ACTIONS_V1_START */
/*
 * Mobile width rule:
 * - Outer application wrappers are edge-to-edge.
 * - Horizontal gutter is applied exactly once on #content/.content.
 * - Existing full-screen file modal rules remain untouched.
 * - Message actions appear above the message list.
 */
.tt24-message-actions-above-list{
  display:flex;
  align-items:stretch;
  flex-wrap:wrap;
  gap:6px;
  width:100%;
  max-width:100%;
  margin:0 0 10px;
}
.tt24-message-actions-above-list > .btn,
.tt24-message-actions-above-list > button{
  margin:0 !important;
}
.tt24-message-list{
  width:100%;
  min-width:0;
  max-width:100%;
}

@media (max-width: 820px){
  html.tt24-mobile-html,
  body.tt24-mobile{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    overflow-x:hidden !important;
  }

  /* Outer wrappers: no cumulative left/right padding. */
  body.tt24-mobile #app,
  body.tt24-mobile .app,
  body.tt24-mobile .app-shell,
  body.tt24-mobile .layout,
  body.tt24-mobile .main,
  body.tt24-mobile .main-content,
  body.tt24-mobile .page,
  body.tt24-mobile .page-content,
  body.tt24-mobile .dashboard,
  body.tt24-mobile .container,
  body.tt24-mobile .wrap,
  body.tt24-mobile main{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-right:0 !important;
    margin-left:0 !important;
    padding-right:0 !important;
    padding-left:0 !important;
    overflow-x:hidden !important;
    box-sizing:border-box !important;
  }

  /* The only page gutter. Safe-area remains respected on iPhone/iPad. */
  body.tt24-mobile #content,
  body.tt24-mobile .content,
  body.tt24-mobile main.content{
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    margin:0 !important;
    padding-right:max(6px, env(safe-area-inset-right, 0px)) !important;
    padding-left:max(6px, env(safe-area-inset-left, 0px)) !important;
    box-sizing:border-box !important;
    overflow-x:hidden !important;
  }

  body.tt24-mobile .topbar,
  body.tt24-mobile header.topbar{
    width:100% !important;
    max-width:100% !important;
    margin-right:0 !important;
    margin-left:0 !important;
    box-sizing:border-box !important;
  }

  /* Direct page cards occupy all available content width. */
  body.tt24-mobile #content > .card,
  body.tt24-mobile #content > .panel,
  body.tt24-mobile #content > .box,
  body.tt24-mobile #content > .section,
  body.tt24-mobile .content > .card,
  body.tt24-mobile .content > .panel,
  body.tt24-mobile .content > .box,
  body.tt24-mobile .content > .section{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-right:0 !important;
    margin-left:0 !important;
    box-sizing:border-box !important;
  }

  body.tt24-mobile .tt24-message-actions-above-list{
    display:grid !important;
    grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr)) !important;
    gap:6px !important;
    margin:0 0 9px !important;
  }

  body.tt24-mobile .tt24-message-actions-above-list > .btn,
  body.tt24-mobile .tt24-message-actions-above-list > button{
    width:100% !important;
    min-width:0 !important;
    min-height:36px !important;
    height:auto !important;
    white-space:normal !important;
    line-height:1.45 !important;
  }
}
/* TT24_MOBILE_FULL_WIDTH_AND_MESSAGE_ACTIONS_V1_END */