/* FiberCore mobile layout layer.
 * Loaded after app.css so legacy responsive rules cannot hide live data.
 */

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

.fc-mobile-scroll-region{
  scrollbar-width:thin;
  overscroll-behavior-inline:contain;
}

@media (max-width:1000px){
  html,body,#app,.sk-app,.sk-main{
    width:100%;
    max-width:100%;
    min-width:0;
  }

  body{
    overflow-x:hidden !important;
  }

  .sk-app{
    display:block !important;
  }

  .sk-main{
    overflow:visible !important;
  }

  .sk-sidebar{
    width:min(88vw,340px) !important;
    max-width:340px !important;
    padding-bottom:env(safe-area-inset-bottom) !important;
  }

  .sk-brand-row{
    min-height:66px;
    padding-top:calc(14px + env(safe-area-inset-top)) !important;
  }

  .sk-nav-btn{
    min-height:46px;
    padding:11px 13px !important;
    font-size:14px !important;
  }

  .sk-topbar{
    min-height:60px !important;
    height:auto !important;
    padding:calc(8px + env(safe-area-inset-top)) 10px 8px !important;
    gap:8px !important;
    z-index:150 !important;
  }

  .sk-topbar-right,
  .sk-topbar-left{
    min-width:0;
    gap:7px !important;
  }

  .sk-hamburger,
  .sk-theme-btn,
  .sk-account-btn{
    min-width:42px !important;
    min-height:42px !important;
    touch-action:manipulation;
  }

  .sk-content-shell{
    width:100%;
    min-width:0;
    padding:12px 10px calc(22px + env(safe-area-inset-bottom)) !important;
    overflow-x:hidden !important;
    overflow-y:visible !important;
  }

  #content,
  #content > *,
  .card,
  .cards,
  .form-grid,
  .table-tools,
  .search-row{
    min-width:0;
    max-width:100%;
  }

  .card{
    border-radius:16px !important;
    padding:16px !important;
    margin-bottom:12px !important;
  }

  .card > h2:first-child,
  .card > h3:first-child{
    margin-top:0;
  }

  .form-grid{
    grid-template-columns:1fr !important;
    gap:11px !important;
  }

  .form-grid > [class*="col-"]{
    grid-column:1 / -1 !important;
    width:100%;
    min-width:0;
  }

  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea{
    max-width:100% !important;
    min-width:0 !important;
    min-height:44px;
    font-size:16px !important;
  }

  .line,
  .line.sale,
  .sale-simple-row{
    grid-template-columns:1fr !important;
  }

  .pay-tabs,
  .tabs,
  .tm-tabs,
  .sub-tabs{
    display:flex !important;
    flex-wrap:nowrap !important;
    max-width:100%;
    overflow-x:auto !important;
    overscroll-behavior-inline:contain;
    scrollbar-width:none;
    padding-bottom:4px;
  }

  .pay-tabs::-webkit-scrollbar,
  .tabs::-webkit-scrollbar,
  .tm-tabs::-webkit-scrollbar,
  .sub-tabs::-webkit-scrollbar{
    display:none;
  }

  .pay-tab,
  .tab-btn,
  .tm-tab,
  .sub-tab{
    flex:0 0 auto !important;
    min-height:43px;
    white-space:nowrap;
  }

  canvas,
  svg,
  img{
    max-width:100%;
  }
}

@media (max-width:760px){
  .sk-account-text,
  .sk-chevron,
  .sk-live-badge{
    display:none !important;
  }

  .sk-account-btn{
    width:42px !important;
    height:42px !important;
    padding:5px !important;
    justify-content:center !important;
    border-radius:13px !important;
  }

  .sk-account-avatar .sk-taccount,
  .sk-account-avatar .user-table-avatar{
    width:30px !important;
    height:30px !important;
  }

  .account-dropdown{
    position:fixed !important;
    top:calc(62px + env(safe-area-inset-top)) !important;
    left:10px !important;
    right:10px !important;
    width:auto !important;
    max-width:none !important;
  }

  .cards{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:9px !important;
  }

  .stat{
    min-height:108px !important;
    padding:13px 11px !important;
  }

  .stat .v{
    font-size:clamp(19px,5.5vw,24px) !important;
    overflow-wrap:anywhere;
  }

  .sk-kpi-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:9px !important;
  }

  .sk-kpi-card{
    display:grid !important;
    grid-template-columns:42px minmax(0,1fr) !important;
    gap:9px !important;
    min-height:104px;
    padding:13px !important;
  }

  .sk-kpi-icon{
    width:42px !important;
    height:42px !important;
  }

  .sk-kpi-val{
    font-size:19px !important;
    overflow-wrap:anywhere;
  }

  .sk-dash-row,
  .sale-view-info-grid,
  .emp-summary,
  .action-cards,
  .wa-tpl-grid{
    grid-template-columns:1fr !important;
  }

  .table-tools{
    display:grid !important;
    grid-template-columns:1fr !important;
    align-items:stretch !important;
    gap:9px !important;
  }

  .table-tools > *,
  .table-tools > div,
  .search-row,
  .section-actions{
    width:100% !important;
    max-width:100%;
  }

  .search-row{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
  }

  .search-row input,
  .search-row select,
  .table-tools select,
  .table-tools input{
    width:100% !important;
    min-width:0 !important;
  }

  .section-actions,
  .actions{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:7px !important;
  }

  .section-actions .btn,
  .mobile-card .actions .btn,
  td.fc-mobile-actions-cell .btn{
    flex:1 1 44% !important;
    min-height:42px;
  }

  /* Generated FiberCore tables already have a dedicated card view. */
  .table-wrap.fc-table-frame{
    display:none !important;
  }

  .mobile-cards{
    display:block !important;
    width:100%;
  }

  .mobile-card{
    display:block !important;
    margin:0 0 10px !important;
    padding:13px !important;
    border-radius:15px !important;
    background:var(--tk-card-bg,#fff) !important;
    border:1px solid var(--tk-card-border,#e2e8f0) !important;
    box-shadow:0 4px 14px rgba(15,23,42,.06) !important;
  }

  .mobile-card-row{
    display:grid !important;
    grid-template-columns:minmax(92px,38%) minmax(0,1fr) !important;
    align-items:start;
    gap:10px !important;
    padding:9px 0 !important;
  }

  .mobile-card-label,
  .mobile-card-value{
    min-width:0;
    max-width:none !important;
    text-align:right !important;
    white-space:normal !important;
    overflow-wrap:anywhere;
  }

  .mobile-card-value{
    color:var(--tk-text,#0f172a);
  }

  .fc-pager,
  .pager{
    position:static !important;
    display:grid !important;
    grid-template-columns:auto minmax(0,1fr) auto !important;
    width:100%;
    gap:6px !important;
    margin:10px 0 !important;
    padding:8px !important;
  }

  .fc-pager .badge,
  .pager .badge{
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:0;
    text-align:center;
    white-space:normal;
  }

  .fc-pager select,
  .pager select{
    grid-column:1 / -1;
    width:100% !important;
  }

  /* Never hide legacy/raw tables. Simple tables become labeled cards. */
  .table-wrap:not(.fc-table-frame){
    display:block !important;
  }

  .table-wrap.mobile-stack-wrap{
    overflow:visible !important;
    border:0 !important;
    background:transparent !important;
  }

  table.fc-mobile-stack{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    border:0 !important;
    background:transparent !important;
  }

  table.fc-mobile-stack thead{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
    white-space:nowrap !important;
    border:0 !important;
  }

  table.fc-mobile-stack tbody,
  table.fc-mobile-stack tfoot{
    display:block !important;
    width:100% !important;
  }

  table.fc-mobile-stack tbody > tr,
  table.fc-mobile-stack tfoot > tr{
    display:block !important;
    width:100% !important;
    margin:0 0 10px !important;
    padding:6px 12px !important;
    border:1px solid var(--tk-card-border,#e2e8f0) !important;
    border-radius:15px !important;
    background:var(--tk-card-bg,#fff) !important;
    box-shadow:0 4px 14px rgba(15,23,42,.05) !important;
  }

  table.fc-mobile-stack tbody > tr[hidden]{
    display:none !important;
  }

  table.fc-mobile-stack td{
    position:static !important;
    display:grid !important;
    grid-template-columns:minmax(92px,38%) minmax(0,1fr) !important;
    align-items:start !important;
    gap:10px !important;
    width:100% !important;
    min-width:0 !important;
    padding:9px 0 !important;
    border:0 !important;
    border-bottom:1px dashed var(--tk-card-border,#e2e8f0) !important;
    background:transparent !important;
    box-shadow:none !important;
    white-space:normal !important;
    text-align:right !important;
    color:var(--tk-text,#0f172a) !important;
    overflow-wrap:anywhere;
  }

  table.fc-mobile-stack td:last-child{
    border-bottom:0 !important;
  }

  table.fc-mobile-stack td::before{
    content:attr(data-mobile-label);
    color:var(--tk-muted,#64748b);
    font-size:12px;
    font-weight:800;
    line-height:1.7;
  }

  table.fc-mobile-stack td.fc-mobile-actions-cell{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:7px !important;
    padding-top:11px !important;
  }

  table.fc-mobile-stack td.fc-mobile-actions-cell::before{
    display:none !important;
  }

  table.fc-mobile-stack tr.fc-mobile-empty-row td{
    display:block !important;
    padding:18px 8px !important;
    text-align:center !important;
    color:var(--tk-muted,#64748b) !important;
  }

  table.fc-mobile-stack tr.fc-mobile-empty-row td::before{
    display:none !important;
  }

  /* Complex tables remain visible and scroll horizontally. */
  .table-wrap.mobile-scroll-wrap{
    display:block !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:visible !important;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-x pan-y;
  }

  table.fc-mobile-scroll{
    display:table !important;
    width:max-content !important;
    min-width:680px !important;
    max-width:none !important;
  }

  table.fc-mobile-scroll.fc-mobile-naked{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch;
  }

  .modal-back{
    align-items:flex-end !important;
    padding:0 !important;
  }

  .modal,
  .modal.wide,
  .modal.wa-messages-modal{
    position:relative !important;
    inset:auto !important;
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    max-height:calc(96dvh - env(safe-area-inset-top)) !important;
    margin:0 !important;
    padding:0 0 env(safe-area-inset-bottom) !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    border-radius:20px 20px 0 0 !important;
  }

  .modal-head,
  .modal.wa-messages-modal > .modal-head{
    position:sticky !important;
    top:0 !important;
    z-index:40 !important;
    min-height:60px;
    margin:0 !important;
    padding:11px 13px !important;
    background:var(--tk-card-bg,#fff) !important;
    border-bottom:1px solid var(--tk-card-border,#e2e8f0) !important;
  }

  .modal-head h2{
    min-width:0;
    font-size:17px !important;
    line-height:1.5;
    overflow-wrap:anywhere;
  }

  .modal > *:not(.modal-head),
  .modal.wide > *:not(.modal-head),
  .modal.wa-messages-modal > *:not(.modal-head){
    max-width:100% !important;
    max-height:none !important;
    overflow:visible !important;
  }

  .modal > form,
  .modal > .form-grid,
  .modal > div:not(.modal-head){
    padding:14px !important;
  }

  .modal .table-wrap{
    max-width:100% !important;
  }

  .modal .col-12:last-child,
  .modal form > .actions:last-child{
    position:sticky;
    bottom:0;
    z-index:20;
    padding:10px !important;
    margin:8px -4px -4px !important;
    background:color-mix(in srgb,var(--tk-card-bg,#fff) 92%,transparent) !important;
    backdrop-filter:blur(10px);
    border-top:1px solid var(--tk-card-border,#e2e8f0) !important;
  }

  .wa-token-row{
    display:grid !important;
    grid-template-columns:1fr !important;
  }

  .wa-days-row,
  .wa-rec-tools,
  .wa-queue-tools{
    align-items:stretch !important;
  }

  .wa-days-row{
    flex-wrap:wrap !important;
  }

  .wa-days-row select,
  .wa-queue-tools select{
    width:100% !important;
  }
}

@media (max-width:380px){
  .cards,
  .sk-kpi-grid{
    grid-template-columns:1fr !important;
  }

  .sk-content-shell{
    padding-inline:7px !important;
  }

  .card{
    padding:13px !important;
  }

  .section-actions .btn,
  .mobile-card .actions .btn,
  td.fc-mobile-actions-cell .btn{
    flex-basis:100% !important;
  }
}

@media print{
  table.fc-mobile-stack{
    display:table !important;
  }

  table.fc-mobile-stack thead{
    position:static !important;
    width:auto !important;
    height:auto !important;
    clip:auto !important;
  }
}
