/* IMARIA v16.4 — Login Redesign & Mobile Responsiveness
   UI/responsive patch only. Desktop workspace design remains unchanged. */
html,body{max-width:100%;overflow-x:hidden}
img,svg,video,canvas{max-width:100%}

/* Login — matches approved diagonal navy / warm-white reference */
.auth-screen{min-height:100dvh;grid-template-columns:1.15fr .85fr;background:linear-gradient(119deg,#073b78 0%,#0b4b91 50.5%,#f8f6f1 50.65%,#f8f6f1 100%);overflow:hidden}
.auth-brand{gap:18px;transform:translateY(2vh)}
.auth-brand .brand-mark{width:66px;height:66px;border-radius:17px;font-size:38px;border-color:#d4af37;color:#f2c94c;background:rgba(4,34,67,.18);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.auth-brand h1{font-size:46px;line-height:1;color:#fff;letter-spacing:.035em}
.auth-brand p{font-size:13px;font-weight:700;color:#fff;margin-top:8px}
.auth-card{width:min(390px,82%);border-radius:18px;padding:30px 32px;box-shadow:0 18px 50px rgba(11,45,79,.12);border:1px solid rgba(11,45,79,.04)}
.auth-card h2{font-size:29px;margin:7px 0 6px}.auth-card .muted{font-size:12px;line-height:1.45}.auth-card .stack{gap:12px;margin:20px 0 12px}.auth-card input{width:100%;min-width:0;background:#f1f4f8;border-color:#d7dde5}.auth-card .btn.primary{width:100%;background:linear-gradient(90deg,#174d87,#0b3c73)}.auth-card #forgotBtn{width:100%;text-align:center}.auth-card .tiny{margin-top:12px}

/* Defensive responsive layout */
.app-shell,main,.content,.card,.metric,.list-item,.project-card,.table-wrap,.toolbar,.form-grid,.account-center{min-width:0}
.content>*{max-width:100%}
input,select,textarea,button{max-width:100%}
textarea{width:100%}

/* Tablets */
@media(max-width:1000px){
  .auth-screen{display:flex;align-items:center;justify-content:center;padding:28px;background:linear-gradient(155deg,#073b78 0 34%,#f8f6f1 34.2% 100%)}
  .auth-brand{display:none}.auth-card{width:min(440px,100%);margin:0}
  .app-shell{grid-template-columns:220px minmax(0,1fr)}
  .sidebar{width:220px}.content{padding-left:20px;padding-right:20px}
}

/* Phones */
@media(max-width:700px){
  body{width:100%;overflow-x:hidden;-webkit-text-size-adjust:100%}
  .auth-screen{padding:20px 16px;align-items:center;background:linear-gradient(160deg,#073b78 0 20%,#f8f6f1 20.2% 100%)}
  .auth-card{width:100%;max-width:430px;padding:26px 20px;border-radius:16px;max-height:calc(100dvh - 32px);overflow-y:auto;-webkit-overflow-scrolling:touch}
  .auth-card h2{font-size:27px}.auth-card input,.auth-card select,.auth-card button{min-height:46px;font-size:16px}

  .app-shell{width:100%;max-width:100vw;overflow-x:hidden}
  .sidebar{width:min(84vw,290px);left:calc(-1 * min(84vw,290px));height:100dvh;overflow-y:auto;overscroll-behavior:contain;z-index:2000;box-shadow:16px 0 36px rgba(0,0,0,.18)}
  .sidebar.open{left:0}
  .sidebar nav button{min-height:44px}
  main{width:100%;max-width:100vw;overflow-x:hidden}
  .topbar{min-height:64px;padding:10px 12px;gap:8px;display:grid;grid-template-columns:auto minmax(0,1fr) auto}
  #mobileMenu{display:inline-grid;place-items:center;width:42px;height:42px;padding:0;font-size:20px}
  .global-search-wrap{width:100%;min-width:0}.global-search-wrap input{width:100%;min-width:0;font-size:16px}
  .portal-top-actions{gap:4px;min-width:0}.portal-top-actions .notification-wrap{display:block}.portal-top-actions .account-wrap{display:block}.top-account{display:flex!important;min-width:0;padding:4px}.top-account-copy,.top-account-chevron{display:none!important}.compact-refresh{display:none!important}
  .portal-topbar .btn{display:none!important}
  .top-dropdown{position:fixed;top:68px;left:12px;right:12px;width:auto!important;max-width:none;max-height:calc(100dvh - 84px);overflow:auto}
  .notification-dropdown,.account-dropdown{width:auto!important}

  .view-heading{padding:14px 14px 0}.view-heading h2{font-size:24px}
  .content{width:100%;max-width:100vw;padding:14px!important;overflow-x:hidden}
  .dashboard-welcome h1{font-size:25px}.dashboard-date{width:100%}
  .metrics,.project-grid,.two-col,.dashboard-main-grid,.dashboard-lower-grid,.account-info-grid,.project-context-grid,.smart-metrics{grid-template-columns:1fr!important}
  .metric,.card{padding:15px;border-radius:13px}
  .metric strong{font-size:27px}
  .section-head{flex-wrap:wrap}.section-head>*{min-width:0}.section-head .btn{min-height:42px}
  .toolbar{display:grid;grid-template-columns:1fr;gap:8px}.toolbar input,.toolbar select,.toolbar button{width:100%;min-width:0;min-height:44px;font-size:16px}
  .form-grid{grid-template-columns:1fr!important}.form-grid .span2{grid-column:auto!important}.form-actions{position:sticky;bottom:0;background:#fff;padding:12px 0 2px;z-index:2;display:grid;grid-template-columns:1fr 1fr}.form-actions .btn{min-height:46px}

  dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;padding:10px;border:0;background:rgba(11,45,79,.18)}
  dialog[open]{display:flex;align-items:flex-end;justify-content:center}
  .modal-card{width:100%;min-width:0!important;max-width:100%!important;max-height:94dvh;overflow:auto;border-radius:18px 18px 10px 10px;background:#fff;-webkit-overflow-scrolling:touch}
  .modal-card>div{padding:22px 16px 18px}.modal-card h2{font-size:24px;padding-right:32px}.dialog-close{position:sticky;float:right;top:8px;right:8px;z-index:4}

  .table-wrap{width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}table{min-width:680px}
  .list-item{grid-template-columns:minmax(0,1fr) auto}.list-title,.list-meta{overflow-wrap:anywhere}
  .project-task-head{flex-direction:column}.project-task-head>*{width:100%}.inline-check-item{min-height:44px;padding:10px 2px}.inline-check-item input{width:20px;height:20px;flex:0 0 20px}
  .cert-recipient-grid{max-height:42dvh}.cert-recipient-row{min-height:48px}
  .director-dept-panel .department-check{min-height:48px}
  .account-center{grid-template-columns:1fr}.account-nav{display:flex;overflow-x:auto;scrollbar-width:none}.account-nav::-webkit-scrollbar{display:none}.account-nav button{min-width:max-content;min-height:44px}
  .privacy-option{align-items:flex-start;flex-direction:column}.privacy-option select{width:100%;max-width:none;font-size:16px}
  .calendar-grid{grid-template-columns:1fr!important}.cal-day{min-height:auto}
  .ai-conversation{height:min(42dvh,330px)}.ai-form-actions{flex-direction:column}.ai-form-actions>*{width:100%;max-width:none!important}
  .toast{left:12px;right:12px;bottom:12px;max-width:none;text-align:center}
}

@media(max-width:390px){
  .content{padding:11px!important}.auth-screen{padding:12px}.auth-card{padding:22px 16px}.view-heading{padding-left:11px;padding-right:11px}.topbar{padding-left:8px;padding-right:8px}.global-search-wrap input{padding-left:30px}
}
