/* SHiNOVA Repair Flow SaaS v1.12.0 — Mobile UI/UX normalization layer.
   Loaded last so the phone layout has one authoritative geometry system. */
:root{
  --rf114-mobile-gap:12px;
  --rf114-mobile-card-radius:12px;
  --rf114-mobile-control:44px;
  --rf114-mobile-edge:max(12px, env(safe-area-inset-left, 0px));
}

@media (max-width:760px){
  html,body,#app,.rf-shell,.rf-main{
    width:100%;
    max-width:100%;
    min-width:0;
  }
  html,body{overflow-x:hidden!important}
  body{min-height:100dvh;background:#f3f6f4}
  *,*::before,*::after{box-sizing:border-box}

  /* One mobile content rail. Nothing inside a route may force the page wider. */
  .v155-shell,.v155-shell .rf-main,.v155-content,.v155-content>*{
    min-width:0;
    max-width:100%;
  }
  .v155-content{
    width:100%;
    padding:12px max(12px,env(safe-area-inset-right,0px)) 22px max(12px,env(safe-area-inset-left,0px))!important;
  }
  .grid,.form-grid,.page-head,.head-actions,.card,.tc-section,.tc-signature-card,
  .tc-detail-body,.tc-financial-panel,.inventory-page-stack,.inventory-section,
  .report-hub,.report-toolbar,.report-grid-2,.report-grid-3,.report-export-layout,
  .svc-page,.svc-grid,.svc-builder,.svc-card,.svc-transfer-card,
  .v180-workspace,.v180-section,.v180-side-stack,.learn-stack,.learn-grid,
  .settings-layout,.settings-module-grid,.settings-admin-grid,.rf-profile-avatar-card{
    min-width:0;
    max-width:100%;
  }
  .grid>*,.form-grid>*,.report-toolbar>*,.report-filter-grid>*,.tc-filterbar>*,
  .inventory-toolbar>*,.svc-toolbar>*,.v180-toolbar>*,.head-actions>*{
    min-width:0!important;
  }

  /* Header: brand, language switch, notification and avatar must never collide. */
  .v155-topbar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    column-gap:7px;
    height:auto!important;
    min-height:68px;
    padding-top:max(5px,env(safe-area-inset-top,0px));
    padding-bottom:5px;
  }
  .v155-topbar .topbar-left{min-width:0;overflow:hidden;display:flex;align-items:center}
  .v155-mobile-brand-lockup{min-width:0;max-width:100%;overflow:hidden;flex:1 1 auto}
  .shinova-brand-logo--mobile{width:min(116px,100%)!important;height:auto!important;max-height:40px!important;object-fit:contain;object-position:left center}
  .v155-mobile-meta{min-width:0;max-width:100%;gap:5px!important;overflow:hidden}
  .v155-mobile-meta>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .v155-mobile-actions{min-width:max-content;flex:0 0 auto;gap:5px!important}
  .v155-bell,.v155-avatar:not(.large){flex:0 0 44px}
  .v1130-mobile-language{max-width:82px;overflow:hidden}
  .v1130-mobile-language button{min-width:31px!important;padding-inline:6px!important}

  /* Page title and actions use vertical rhythm instead of side-by-side squeezing. */
  .v155-page-head,.page-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    align-items:stretch!important;
    gap:10px!important;
    width:100%;
  }
  .v155-page-title{width:100%;min-width:0;align-items:flex-start!important}
  .v155-page-title>div{flex:1 1 auto;min-width:0}
  .v155-page-title h2{font-size:18px!important;line-height:1.35!important;overflow-wrap:anywhere;margin:1px 0 3px!important}
  .v155-page-title p{font-size:11px!important;line-height:1.55!important;overflow-wrap:anywhere;margin:0!important}
  .head-actions{
    display:grid!important;
    grid-template-columns:repeat(auto-fit,minmax(128px,1fr));
    gap:8px!important;
    width:100%!important;
  }
  .head-actions>.btn,.head-actions>button,.head-actions>a{
    width:100%;
    min-width:0!important;
    min-height:44px;
    white-space:normal;
  }

  /* Consistent card system: no fixed heights, no negative card collisions. */
  .card,.tc-section,.tc-signature-card,.tc-financial-panel,.report-toolbar,.report-export-panel,
  .report-kpi,.inventory-requisition,.inventory-section>.card,.svc-card,.svc-transfer-card,
  .v180-section,.learn-card,.settings-module-card,.settings-admin-card,.rf-profile-avatar-card,
  .v155-recent-ticket,.action-card{
    width:100%;
    min-width:0!important;
    max-width:100%;
    height:auto!important;
    border-radius:var(--rf114-mobile-card-radius)!important;
    overflow-wrap:anywhere;
  }
  .card{padding:14px!important}
  .card h3,.tc-section h3,.report-export-panel h3{line-height:1.4;overflow-wrap:anywhere}
  .grid,.inventory-page-stack,.report-hub,.learn-stack,.v156-profile-page{gap:10px!important}
  .grid.two,.grid.three,.grid.main-side,.form-grid,.form-grid.three,.settings-layout,
  .report-grid-2,.report-grid-3,.report-export-layout,.svc-builder,.v180-workspace,
  .learn-layout,.learn-onboarding{
    grid-template-columns:minmax(0,1fr)!important;
  }

  /* KPI rows stay compact but expand naturally for Myanmar/long labels. */
  .grid.kpis,.report-kpis,.inventory-kpis,.svc-kpis,.v180-grid-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    align-items:stretch;
    gap:8px!important;
  }
  .kpi,.report-kpi,.svc-kpi,.v180-kpi{
    min-width:0!important;
    min-height:96px!important;
    height:auto!important;
    padding:12px!important;
  }
  .kpi .label,.report-kpi span,.svc-kpi span,.v180-kpi span{
    white-space:normal!important;
    overflow-wrap:anywhere;
    line-height:1.45!important;
  }
  .kpi .value,.report-kpi strong,.svc-kpi strong,.v180-kpi strong{
    overflow-wrap:anywhere;
    word-break:normal;
  }

  /* Forms: every input stays inside its card and remains iOS-zoom safe. */
  .field,.learn-field{min-width:0;width:100%}
  .field input,.field select,.field textarea,
  .tc-filterbar input,.tc-filterbar select,.tc-actionbar select,
  .report-toolbar input,.report-toolbar select,.report-filter-grid input,.report-filter-grid select,
  .inventory-toolbar input,.inventory-toolbar select,.svc-toolbar input,.svc-toolbar select,
  .v180-toolbar input,.v180-toolbar select,.learn-filterbar input,.learn-filterbar select,
  .learn-form input,.learn-form select,.learn-form textarea{
    width:100%!important;
    max-width:100%;
    min-width:0!important;
    min-height:var(--rf114-mobile-control);
    font-size:16px!important;
  }
  .form-grid,.tc-condition-grid,.tc-condition-read,.inventory-detail-grid,.svc-ticket-grid,
  .learn-form-grid,.report-filter-grid,.report-toolbar,.inventory-toolbar,.inventory-toolbar.compact,
  .v180-toolbar,.v180-toolbar.two{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .field.full,.learn-field.full,.inventory-search,.v180-toolbar>:first-child{grid-column:auto!important}

  /* Action clusters wrap rather than overlap adjacent cards. */
  .tc-actionbar,.tc-financial-actions,.inventory-req-actions,.inventory-req-row-actions,
  .report-export-actions,.report-actions-inline,.svc-transfer-actions,.v180-section-actions,
  .learn-admin-actions,.modal-footer,.customer-track-modal-actions{
    display:flex;
    flex-wrap:wrap!important;
    gap:8px!important;
    width:100%;
  }
  .tc-actionbar>*,.tc-financial-actions>.btn,.report-export-actions>.btn,.svc-transfer-actions>.btn,
  .v180-section-actions>.btn,.modal-footer>.btn{
    flex:1 1 132px;
    min-width:0!important;
  }
  .tc-actionbar select{flex-basis:100%!important}

  /* Tables: mobile-card tables become independent cards; true data grids scroll only inside their wrapper. */
  .table-wrap,.report-table-wrap,.inventory-table-wrap,.v180-table-wrap{
    width:100%;
    max-width:100%;
    min-width:0;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-x:contain;
  }
  .v155-mobile-card-table,.inventory-mobile-table{
    margin:0!important;
  }
  .inventory-mobile-table{
    min-width:0!important;
    width:100%!important;
    display:block!important;
    table-layout:auto!important;
  }
  .inventory-mobile-table thead{display:none!important}
  .inventory-mobile-table tbody{display:block!important;width:100%!important}
  .inventory-mobile-table tr{display:block!important;width:100%!important}
  .inventory-mobile-table td{display:grid!important;width:100%!important}
  .v155-mobile-card-table tr,.inventory-mobile-table tr{
    width:100%!important;
    max-width:100%;
    min-width:0;
    margin-bottom:9px!important;
    overflow:hidden;
  }
  .v155-mobile-card-table td,.inventory-mobile-table td{
    min-width:0!important;
    max-width:100%;
    overflow-wrap:anywhere!important;
    word-break:normal;
  }
  .inventory-mobile-table td{grid-template-columns:minmax(92px,36%) minmax(0,1fr)!important;text-align:left!important}
  .inventory-mobile-table td::before{min-width:0;overflow-wrap:anywhere}
  .inventory-action-cell,.inventory-req-row-actions{max-width:100%}
  .inventory-req-row-actions .btn{flex:1 1 100px}
  .report-table-wrap{overflow-x:auto!important}
  .report-table{min-width:720px}

  /* Workshop: one horizontal workflow strip, one stable lane/card width. */
  .kanban.responsive-kanban.r383-kanban,.kanban.responsive-kanban{
    display:flex!important;
    flex-flow:row nowrap!important;
    align-items:stretch!important;
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    gap:10px!important;
    padding:2px 1px 12px!important;
    scroll-snap-type:x mandatory!important;
  }
  .kanban.responsive-kanban.r383-kanban>.kan-col,.kanban.responsive-kanban>.kan-col{
    flex:0 0 calc(100vw - 42px)!important;
    width:calc(100vw - 42px)!important;
    min-width:calc(100vw - 42px)!important;
    max-width:calc(100vw - 42px)!important;
    min-height:0!important;
    margin:0!important;
    scroll-snap-align:start;
  }
  .kan-col{overflow:hidden}
  .ticket-card,.kanban-ticket-r383{width:100%;max-width:100%;min-width:0;margin:0 0 9px!important}
  .kanban-card-top,.kanban-card-meta{min-width:0;align-items:flex-start}
  .kanban-card-top>*:first-child,.kanban-card-meta>*:first-child{min-width:0;overflow-wrap:anywhere}
  .kanban-tech{max-width:48%;min-width:0}
  .kanban-status-select{max-width:100%;font-size:16px!important}

  /* Drawers and modals become phone-native surfaces and respect the bottom nav/safe area. */
  .drawer-backdrop,.modal-backdrop{padding:0!important;align-items:flex-end!important;place-items:end stretch!important}
  .drawer,.modal,.inventory-modal,.svc-modal{
    width:100vw!important;
    max-width:100vw!important;
    min-width:0!important;
    max-height:calc(100dvh - env(safe-area-inset-top,0px))!important;
    margin:0!important;
    border-radius:18px 18px 0 0!important;
    padding:16px max(14px,env(safe-area-inset-right,0px)) calc(18px + env(safe-area-inset-bottom,0px)) max(14px,env(safe-area-inset-left,0px))!important;
    overflow:auto!important;
    overscroll-behavior:contain;
  }
  .drawer{height:auto!important;min-height:45dvh}
  .drawer-head{position:sticky;top:-16px;z-index:2;background:#fff;padding:4px 0 10px;margin-bottom:10px!important}
  .drawer-head h3{min-width:0;overflow-wrap:anywhere}
  .modal-footer{position:sticky;bottom:calc(-18px - env(safe-area-inset-bottom,0px));background:#fff;padding:10px 0 env(safe-area-inset-bottom,0px);margin-bottom:calc(-18px - env(safe-area-inset-bottom,0px))}

  /* More sheet and profile card alignment. */
  .v155-more-sheet{width:100%;max-width:100%;border-radius:18px 18px 0 0!important}
  .v155-profile-card.v156-profile-card{grid-template-columns:44px minmax(0,1fr) 20px!important;gap:10px!important}
  .v156-profile-copy{min-width:0!important}
  .v156-profile-copy b,.v156-profile-copy small{overflow-wrap:anywhere;white-space:normal}
  .v155-more-list>button{grid-template-columns:34px minmax(0,1fr) 18px!important;min-width:0}
  .v155-more-list>button>span{min-width:0}
  .v155-more-list b,.v155-more-list small{white-space:normal;overflow-wrap:anywhere;line-height:1.45}

  /* Dashboard and floating actions cannot cover the last card. */
  .v155-mobile-dashboard,.rf-full-dashboard{padding-bottom:68px}
  .v155-dashboard-fab{max-width:calc(100vw - 28px);white-space:normal;text-align:center}
  .learn-help-fab{bottom:calc(var(--v155-mobile-nav) + var(--v155-safe-bottom) + 14px)!important}

  /* Report Hub: filters are intentionally stacked on phones for clarity. */
  .report-toolbar,.report-filter-grid{grid-template-columns:minmax(0,1fr)!important}
  .report-tabs{margin-inline:-2px;padding-bottom:6px;scroll-snap-type:x proximity}
  .report-tabs button{flex:0 0 auto;min-height:42px;scroll-snap-align:start}
  .report-data-quality,.report-template-row,.report-summary-line{min-width:0}
  .report-data-quality,.report-template-row{flex-direction:column;align-items:stretch!important}
  .report-summary-line{align-items:flex-start}
  .report-summary-line>*{min-width:0;overflow-wrap:anywhere}

  /* Financial, service menu, supplier, learning and profile cards. */
  .tc-financial-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .tc-financial-summary>div{min-width:0}
  .tc-financial-summary b{font-size:15px;overflow-wrap:anywhere}
  .svc-grid,.svc-meta,.svc-ticket-grid{grid-template-columns:minmax(0,1fr)!important}
  .svc-card-head,.svc-public-intro,.svc-transfer-card{align-items:stretch!important}
  .svc-option-row{max-width:100%;min-width:0}
  .svc-option-row .svc-actions{min-width:0}
  .v180-grid-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .v180-side-stack,.v180-detail-grid{grid-template-columns:minmax(0,1fr)!important}
  .v180-section-head{align-items:stretch!important}
  .v180-table tr{grid-template-columns:minmax(0,1fr)!important}
  .v180-table td[data-wide="1"]{grid-column:auto!important}
  .learn-hero{grid-template-columns:minmax(0,1fr)!important;padding:16px!important}
  .learn-hero-side{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .learn-filterbar{align-items:stretch!important}
  .learn-filterbar>*{flex:1 1 100%!important;min-width:0!important}
  .learn-guide-row{grid-template-columns:minmax(0,1fr)!important}
  .learn-guide-progress{min-width:0!important;text-align:left!important}
  .rf-profile-avatar-card{grid-template-columns:72px minmax(0,1fr)!important;gap:12px!important}
  .rf-profile-avatar-actions{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));width:100%}
  .rf-profile-avatar-actions .btn{width:100%;min-width:0}

  /* Settings and Trade-In controls: no two controls are allowed to occupy the same visual row accidentally. */
  .settings-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .settings-role-actions,.inspection-toolbar-controls,.trade-module-nav{max-width:100%;min-width:0}
  .inspection-toolbar-controls{grid-template-columns:minmax(0,1fr)!important}
  .component-check-row{max-width:100%;min-width:0}

  /* Language-specific copy gets room to wrap without changing component geometry. */
  html[lang="my"] .card,html[lang="my"] .btn,html[lang="my"] .field,
  html[lang="my"] .v155-more-list,html[lang="my"] .v155-bottom-nav,
  html[lang="my"] .report-hub,html[lang="my"] .tc-section{
    word-break:normal;
    overflow-wrap:anywhere;
  }
  html[lang="my"] .v155-bottom-nav button span{font-size:9px;line-height:1.25;white-space:normal;text-align:center;max-height:2.5em}
}

@media (max-width:430px){
  .v155-content{padding-left:10px!important;padding-right:10px!important}
  .head-actions{grid-template-columns:minmax(0,1fr)!important}
  .card{padding:12px!important}
  .inventory-mobile-table td,.v155-mobile-card-table:not(.settings-matrix-table) td{
    grid-template-columns:minmax(82px,34%) minmax(0,1fr)!important;
  }
  .report-kpis,.grid.kpis,.svc-kpis,.v180-grid-kpis{gap:7px!important}
  .learn-hero-side{grid-template-columns:minmax(0,1fr)!important}
}

@media (max-width:360px){
  .shinova-brand-logo--mobile{width:86px!important;max-height:34px!important}
  .v155-mobile-meta>span{display:none!important}
  .v155-mobile-meta{margin-top:0!important}
  .v155-mobile-actions{gap:3px!important}
  .v1130-mobile-language{max-width:65px}
  .v1130-mobile-language button{min-width:28px!important;padding-inline:4px!important;font-size:9px!important}
  .v155-bell,.v155-avatar:not(.large){width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;flex-basis:40px!important}
  .grid.kpis,.report-kpis,.svc-kpis,.v180-grid-kpis{grid-template-columns:minmax(0,1fr)!important}
  .tc-financial-summary,.settings-stat-grid{grid-template-columns:minmax(0,1fr)!important}
  .kanban.responsive-kanban.r383-kanban>.kan-col,.kanban.responsive-kanban>.kan-col{
    flex-basis:calc(100vw - 30px)!important;
    width:calc(100vw - 30px)!important;
    min-width:calc(100vw - 30px)!important;
    max-width:calc(100vw - 30px)!important;
  }
}

@media (max-width:760px) and (orientation:landscape){
  .v155-topbar{min-height:58px;padding-top:3px;padding-bottom:3px}
  .v155-content{padding-top:9px!important}
  .drawer,.modal,.inventory-modal,.svc-modal{max-height:94dvh!important}
}
