/* ========================================================================
   TGWork V9 — responsive/mobile layer
   Loaded after all legacy/workforce CSS so it can neutralize old min-width
   rules without changing desktop behavior.
   ======================================================================== */

/* PWA install control lives at the literal bottom of the common footer. */
.pwa-install-strip{
  max-width:1480px;margin:0 auto;padding:14px 16px 18px;border-top:1px solid rgb(var(--line));
  display:flex;align-items:center;justify-content:space-between;gap:14px;color:rgb(var(--fg));
}
.pwa-install-copy{display:grid;gap:3px;min-width:0}.pwa-install-copy b{font-size:13px}.pwa-install-copy span{font-size:12px;color:rgb(var(--muted));line-height:1.4}
.pwa-install-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;padding:8px 14px;border:1px solid rgb(var(--line-strong));border-radius:11px;background:rgb(var(--surface-2));color:rgb(var(--fg));font:inherit;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap}
.pwa-install-btn:hover,.pwa-install-btn.ready{border-color:rgb(var(--brand));background:rgb(var(--brand-soft));color:rgb(var(--brand-ink))}.pwa-install-btn:disabled{opacity:.65;cursor:default}.pwa-install-btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
@media(min-width:641px){.pwa-install-strip{padding-left:24px;padding-right:24px}}

/* Owner-only password controls inside the employee card. */
.wf-owner-password{display:grid;gap:8px;padding:10px;border:1px solid rgba(245,158,11,.28);border-radius:10px;background:rgba(245,158,11,.055);min-width:0}
.wf-owner-password-head{display:grid;gap:3px}.wf-owner-password-head b{font-size:12px}.wf-owner-password-head small{font-size:10.5px;line-height:1.4;color:var(--muted,#94a3b8);font-weight:500}
.wf-owner-password-row{display:grid;grid-template-columns:minmax(180px,1fr) auto auto auto;gap:7px;align-items:center}.wf-owner-password-input{position:relative;min-width:0}.wf-owner-password-input input{height:34px!important;padding:6px 34px 6px 9px!important}.wf-password-eye{position:absolute;right:3px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:1px solid transparent;border-radius:7px;background:transparent;color:inherit;cursor:pointer}.wf-password-eye:hover{background:rgba(148,163,184,.12);border-color:var(--border,rgba(148,163,184,.18))}.wf-owner-password-row .wf-btn{min-height:34px!important;height:34px!important;padding:5px 9px!important;white-space:nowrap!important}.wf-owner-password-result{font-size:11px;line-height:1.4;color:rgb(var(--ok));overflow-wrap:anywhere}

@media(max-width:900px){
  html,body{width:100%;max-width:100%;overflow-x:hidden!important}
  *,*::before,*::after{box-sizing:border-box}
  .app-shell,.page-wrap,.page,.site-footer,.footer-inner,.footer-bottom,.pwa-install-strip{min-width:0!important;max-width:100%!important}
  .page{padding:14px 10px 30px!important;overflow:visible!important}
  .page-head{align-items:flex-start!important;margin-bottom:14px!important}.page-head h1{font-size:21px!important;overflow-wrap:anywhere}
  img,video,canvas,iframe,svg{max-width:100%}
  pre{max-width:100%;white-space:pre-wrap!important;word-break:break-word!important;overflow-wrap:anywhere}
  code{overflow-wrap:anywhere;word-break:break-word}
  input,select,textarea,button{max-width:100%;min-width:0}
  .action-row,.wf-actions,.wf-inline,.section-head,.settings-session-head{flex-wrap:wrap!important;min-width:0!important}
  .form-grid,.wf-form-grid,.settings-grid,.composer-grid,.link-panel,.doc-upload-grid,.license-fields{grid-template-columns:1fr!important}

  /* Top bar: keep all actions visible but stop them forcing page width. */
  .topbar-shell{padding:0 8px!important;gap:4px!important;min-width:0!important}
  .topbar-actions{gap:2px!important;min-width:0!important}.icon-btn{width:34px;height:34px}
  .lang-toggle a{padding:5px 7px!important;font-size:11px!important}.crumbs{min-width:0;max-width:32vw}.crumbs b{max-width:25vw}

  /* Legacy wrappers must not create a right-left scroll region. */
  .wf-table-wrap,.table-wrap,.table-responsive,.table-scroll,.responsive-table,.card-table-wrap,[class*="table-wrap"]{overflow-x:visible!important;max-width:100%!important;min-width:0!important;width:100%!important}
  .wf-directory-table,.wf-compact-filter-table,.wf-table,table.tg-mobile-card-table{min-width:0!important;width:100%!important;max-width:100%!important;table-layout:auto!important}

  /* Generic table -> vertical cards. JS copies each TH into data-mobile-label. */
  table.tg-mobile-card-table{display:block!important;border:0!important;background:transparent!important}
  table.tg-mobile-card-table>caption{display:block;width:100%;text-align:left}
  table.tg-mobile-card-table thead{display:none!important}
  table.tg-mobile-card-table tbody{display:grid!important;grid-template-columns:1fr!important;gap:9px!important;width:100%!important;min-width:0!important}
  table.tg-mobile-card-table tbody tr{display:block!important;width:100%!important;min-width:0!important;border:1px solid rgb(var(--line))!important;border-radius:12px!important;background:rgb(var(--surface))!important;overflow:hidden!important;box-shadow:none!important}
  table.tg-mobile-card-table tbody td{display:grid!important;grid-template-columns:minmax(88px,34%) minmax(0,1fr)!important;gap:9px!important;align-items:start!important;width:100%!important;min-width:0!important;max-width:100%!important;height:auto!important;min-height:34px!important;padding:7px 9px!important;border:0!important;border-bottom:1px solid rgb(var(--line))!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere!important;word-break:break-word!important;font-size:12px!important;line-height:1.35!important}
  table.tg-mobile-card-table tbody td:last-child{border-bottom:0!important}
  table.tg-mobile-card-table tbody td::before{content:attr(data-mobile-label);display:block;min-width:0;color:rgb(var(--muted));font-size:10px;font-weight:750;line-height:1.3;overflow-wrap:anywhere}
  table.tg-mobile-card-table tbody td>*{min-width:0!important;max-width:100%!important}
  table.tg-mobile-card-table tbody td form{width:100%!important;min-width:0!important}
  table.tg-mobile-card-table tbody td input,table.tg-mobile-card-table tbody td select,table.tg-mobile-card-table tbody td textarea{width:100%!important;max-width:100%!important}
  table.tg-mobile-card-table tbody td.tg-mobile-full-cell{grid-template-columns:1fr!important}.tg-mobile-full-cell::before{display:none!important}
  table.tg-mobile-card-table tbody tr.wf-person-row{cursor:pointer!important}

  /* Tables with filters keep a compact, wrapped filter panel above cards. */
  table.tg-mobile-filter-table thead{display:block!important;width:100%!important;margin:0 0 8px!important}
  table.tg-mobile-filter-table thead tr{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important;width:100%!important;border:1px solid rgb(var(--line))!important;border-radius:10px!important;padding:6px!important;background:rgb(var(--surface-2))!important}
  table.tg-mobile-filter-table thead th{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;padding:0!important;border:0!important;white-space:normal!important}
  table.tg-mobile-filter-table thead .wf-th-inline{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;gap:4px!important;align-items:center!important;width:100%!important;min-width:0!important}
  table.tg-mobile-filter-table thead .wf-th-label{font-size:9.5px!important;line-height:1.15!important;white-space:normal!important;overflow-wrap:anywhere!important}
  table.tg-mobile-filter-table thead .wf-head-filter,table.tg-mobile-filter-table thead input,table.tg-mobile-filter-table thead select{display:block!important;flex:none!important;width:100%!important;max-width:100%!important;min-width:0!important;height:27px!important;min-height:27px!important;padding:2px 5px!important;font-size:10.5px!important;border-radius:6px!important}

  /* Employee/candidate/salary dialogs: one vertical flow, no hidden right side. */
  dialog.wf-person-dialog{width:calc(100vw - 10px)!important;max-width:calc(100vw - 10px)!important;height:auto!important;max-height:calc(100dvh - 10px)!important;margin:auto!important;border-radius:12px!important}
  .wf-person-shell{max-height:calc(100dvh - 10px)!important;min-width:0!important}
  .wf-person-head{padding:10px 11px!important}.wf-person-head h3{font-size:14px!important}.wf-person-head p{font-size:10px!important}
  .wf-person-body{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;padding:10px!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important}
  .wf-person-side{display:grid!important;grid-template-columns:84px minmax(0,1fr)!important;gap:10px!important;align-items:start!important}.wf-person-side>.wf-person-photo{width:84px!important;max-width:84px!important;grid-row:1/span 2!important}.wf-person-photo-meta{margin:0!important}.wf-person-left-fields{margin:0!important;gap:5px!important}
  .wf-person-main{gap:10px!important}.wf-person-name{font-size:18px!important}.wf-person-sub{font-size:11px!important;margin-bottom:8px!important}.wf-person-grid,.wf-kv-grid{grid-template-columns:1fr!important}
  .wf-person-foot{padding:9px 10px!important;position:sticky!important;bottom:0!important;z-index:2!important;background:rgb(var(--surface))!important}.wf-person-actions{width:100%;justify-content:flex-end!important}.wf-person-actions .wf-btn{min-height:34px}

  .wf-person-edit-shell{grid-template-columns:1fr!important;gap:10px!important}.wf-person-edit-side,.wf-person-edit-main{min-width:0!important}.wf-person-edit-side>.wf-person-photo{width:92px!important}.wf-person-edit-main-grid{grid-template-columns:1fr!important}.wf-person-edit-main-grid .wf-span-2{grid-column:auto!important}
  .wf-owner-password-row{grid-template-columns:1fr 1fr!important}.wf-owner-password-input{grid-column:1/-1!important}.wf-owner-password-row .wf-btn{width:100%!important}

  .wf-modal{padding:5px!important;overflow:hidden!important}.wf-modal-card,.wf-modal-card.wf-admin-candidate-card,.wf-modal-card.wf-salary-detail,.wf-modal-card.wf-termination-modal{width:calc(100vw - 10px)!important;max-width:calc(100vw - 10px)!important;height:calc(100dvh - 10px)!important;max-height:calc(100dvh - 10px)!important;border-radius:12px!important;overflow:hidden!important}
  .wf-admin-candidate-card .wf-modal-scroll,.wf-salary-detail .wf-modal-scroll{padding:10px!important;overflow-y:auto!important;overflow-x:hidden!important}.wf-admin-candidate-card .wf-person-layout{grid-template-columns:1fr!important}.wf-admin-candidate-card .wf-person-left{display:grid!important;grid-template-columns:90px minmax(0,1fr)!important;gap:10px!important}.wf-admin-candidate-card .wf-person-left .wf-person-photo{width:90px!important;max-width:90px!important}.wf-admin-candidate-card .wf-person-left-data{margin:0!important}.wf-admin-candidate-card .wf-kv-grid,.wf-salary-detail .wf-summary-grid{grid-template-columns:1fr!important}
  .wf-termination-modal .wf-termination-form{padding:10px!important;overflow-y:auto!important;overflow-x:hidden!important}.wf-termination-modal .wf-modal-sticky-actions{margin:4px -10px 0!important;padding:8px 10px!important;display:flex!important;gap:6px!important;flex-wrap:wrap!important}.wf-termination-modal .wf-modal-sticky-actions>*{flex:1 1 140px!important}

  /* Other frequent multi-column controls. */
  .wf-role-manager-v8,.wf-role-create,.wf-role-crud .wf-form-grid,.wf-summary-grid,.summary-grid,.kpi-grid,.metrics-grid{grid-template-columns:1fr!important}
  .manage-row,.file-row,.notif-hero,.notif-status,.section-head{min-width:0!important;max-width:100%!important}.manage-row>*{min-width:0!important}
  .btn,.wf-btn,button,a{overflow-wrap:anywhere}

  .footer-inner{padding:22px 12px 16px!important;gap:20px!important}.footer-bottom{padding:12px!important;display:grid!important;grid-template-columns:1fr!important;gap:9px!important}.footer-bottom nav{gap:8px 12px!important}.pwa-install-strip{padding:12px!important;display:grid!important;grid-template-columns:1fr!important}.pwa-install-btn{width:100%!important;min-height:42px!important}
}

@media(max-width:560px){
  .crumbs{display:none!important}.topbar-shell{min-height:52px!important}.topbar-actions{margin-left:auto!important}.topbar-actions .icon-btn{width:32px;height:32px}.lang-toggle a{padding:5px 6px!important}
  table.tg-mobile-filter-table thead tr{grid-template-columns:1fr!important}
  table.tg-mobile-card-table tbody td{grid-template-columns:minmax(78px,31%) minmax(0,1fr)!important;padding:7px 8px!important}
  .wf-person-side{grid-template-columns:72px minmax(0,1fr)!important}.wf-person-side>.wf-person-photo{width:72px!important;max-width:72px!important}
  .wf-owner-password-row{grid-template-columns:1fr!important}.wf-owner-password-input{grid-column:auto!important}
}

/* TGWork V11 — PWA install help, especially iOS where beforeinstallprompt is unavailable. */
.pwa-help-dialog{width:min(470px,calc(100vw - 24px));padding:0;border:1px solid rgb(var(--line));border-radius:16px;background:rgb(var(--surface));color:rgb(var(--fg));box-shadow:0 28px 80px rgba(0,0,0,.42)}
.pwa-help-dialog::backdrop{background:rgba(2,6,23,.68);backdrop-filter:blur(3px)}.pwa-help-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:16px 16px 12px;border-bottom:1px solid rgb(var(--line))}.pwa-help-head>div{display:grid;gap:3px}.pwa-help-head b{font-size:15px}.pwa-help-head span{font-size:11px;color:rgb(var(--muted))}.pwa-help-close{width:31px;height:31px;border:1px solid rgb(var(--line));border-radius:9px;background:transparent;color:inherit;font-size:20px;line-height:1;cursor:pointer}.pwa-help-body{padding:16px;display:grid;gap:10px}.pwa-help-body p{margin:0;line-height:1.5;font-size:13px}.pwa-help-body ol{margin:0;padding-left:22px;display:grid;gap:7px;font-size:13px;line-height:1.45}.pwa-help-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:rgb(var(--brand-soft));color:rgb(var(--brand-ink));font-size:24px;font-weight:800}.pwa-help-actions{display:flex;justify-content:flex-end;padding:0 16px 16px}
@media(max-width:640px){.pwa-help-dialog{width:calc(100vw - 18px)}.pwa-help-head,.pwa-help-body{padding-left:13px;padding-right:13px}.pwa-help-actions{padding:0 13px 13px}.pwa-help-actions .pwa-install-btn{width:100%}}
