/* GuardManage responsive owner: login, tablet shell and compact mobile layouts. */
html,body,#app{min-height:100%;max-width:100%;overflow-x:hidden}
.login-page{min-height:100vh;min-height:100dvh;padding:max(24px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left));}
.login-card{width:min(500px,100%);min-width:0;overflow:hidden}
.login-card>.gm-login-logo{width:min(250px,62%);max-width:62%;max-height:180px;object-fit:contain;object-position:center;display:block;margin:0 auto 22px}
.login-card .brand{line-height:1.04;overflow-wrap:anywhere;word-break:normal}
.login-card .sub{line-height:1.4}
.login-card form,.login-card .field{min-width:0}
.login-card input{min-width:0}

/* License details belong only in Settings > System for owner/admin. The legacy dashboard cards stay hidden for every tenant role. */
.tenant-content>.cards{display:none!important}
.gard-license-card{margin-top:14px;border:1px solid var(--gard-line,#DCE5F1);border-radius:14px;background:#fff;padding:18px}
.gard-license-card>span{font-size:10px;letter-spacing:.12em;font-weight:800;color:var(--tenant-primary,#2563EB)}
.gard-license-card h3{margin:4px 0 6px}
.gard-license-card p{margin:0 0 14px}
.gard-license-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.gard-license-grid>div{min-width:0;border:1px solid var(--gard-line,#DCE5F1);border-radius:10px;background:#f8fbff;padding:11px 12px;display:flex;flex-direction:column;gap:4px}
.gard-license-grid span{font-size:10px;color:var(--tenant-muted-text,#64748B)}
.gard-license-grid b{font-size:14px;overflow-wrap:anywhere}

/* Canonical line icons. This disables the legacy absolute pseudo icon that caused text overlap. */
.gm-tenant-nav button::before{content:none!important;display:none!important}
.gm-tenant-nav button{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:9px!important;padding-left:11px!important}
.gm-nav-icon{width:19px;height:19px;flex:0 0 19px;display:inline-grid;place-items:center;color:#9aa6b5;line-height:0}
.gm-nav-icon svg{display:block;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.gm-tenant-nav button.active .gm-nav-icon{color:var(--tenant-primary,#D8B22D)}
.gm-nav-label{display:block;min-width:0;line-height:1.15}

/* Settings tabs use a stable number/title layout instead of colliding text. */
.gm2225-settings-tabs>button{display:grid!important;grid-template-columns:34px minmax(0,1fr)!important;grid-template-areas:"num title" "num sub"!important;align-items:center!important;column-gap:9px!important;row-gap:2px!important;text-align:left!important;overflow:hidden!important}
.gm2225-settings-tabs>button>span{grid-area:num!important;align-self:stretch;display:grid;place-items:center;font-weight:900!important}
.gm2225-settings-tabs>button>b{grid-area:title!important;display:block;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gm2225-settings-tabs>button>small{grid-area:sub!important;display:block;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

@media (max-width:1024px){
  .gm-tenant-shell{grid-template-columns:minmax(0,1fr)!important}
  .gm-tenant-sidebar{position:relative!important;top:auto!important;height:auto!important;min-height:0!important;padding:max(14px,env(safe-area-inset-top)) 14px 11px!important;overflow:hidden!important;border-right:0!important;border-bottom:1px solid rgba(255,255,255,.10)}
  .gm-brand-box{display:flex!important;align-items:center!important;gap:12px!important;padding:3px 4px 11px!important;margin:0 0 8px!important;border-bottom:1px solid rgba(255,255,255,.10)!important;min-width:0}
  .gm-brand-box img{width:108px!important;max-width:108px!important;height:52px!important;max-height:52px!important;object-fit:contain!important;object-position:left center!important;flex:0 0 108px}
  .gm-brand-name{min-width:0;max-width:calc(100vw - 160px);margin:0!important;font-size:14px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .gm-tenant-nav{display:flex!important;flex-direction:row!important;gap:7px!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;padding:1px 0 5px!important;scrollbar-width:thin;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
  .gm-tenant-nav button{flex:0 0 auto!important;width:auto!important;min-width:max-content!important;min-height:44px!important;padding:9px 13px!important;white-space:nowrap!important;box-shadow:none!important;scroll-snap-align:start}
  .gm-tenant-nav button.active{box-shadow:inset 0 -3px 0 var(--tenant-primary,#2563EB)!important}
  .gm-sidebar-foot{display:none!important}
  .gm-tenant-shell .tenant-header{position:relative!important;top:auto!important}
  .gm-tenant-shell .tenant-content{padding:18px!important;max-width:100%!important}
  .grid3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gard-license-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .modal,.gb-modal{max-width:calc(100vw - 28px)!important}
}

@media (max-width:820px){
  .login-page{place-items:start center!important;align-content:start;padding:clamp(12px,4vw,22px)!important;padding-top:max(clamp(14px,4vw,22px),env(safe-area-inset-top))!important;padding-bottom:max(24px,env(safe-area-inset-bottom))!important;background:linear-gradient(180deg,#08142B 0 150px,#eef3f9 150px 100%)!important}
  .login-card{width:100%!important;max-width:620px!important;margin:0!important;padding:clamp(22px,5vw,30px)!important;border-radius:20px!important;box-shadow:0 18px 50px rgba(3,12,28,.24)!important}
  .login-card>.gm-login-logo{width:min(220px,48vw)!important;max-width:48vw!important;max-height:150px!important;margin-bottom:18px!important}
  .login-card .brand{font-size:clamp(28px,6vw,36px)!important}
  .login-card .sub{font-size:16px!important;margin-bottom:18px!important}
  .login-card .field{margin:12px 0!important}
  .login-card .field label{font-size:12px!important}
  .login-card .field input{min-height:48px!important;font-size:16px!important;padding:11px 12px!important}
  .login-card .btn.primary{min-height:48px!important;font-size:15px!important}
  .login-card .message{margin-bottom:0!important}
  .gm-tenant-shell .tenant-content{padding:14px!important}
  .gm2225-settings-shell,.gm2230-settings-shell{gap:12px!important}
  .gm2225-settings-tabs{display:flex!important;gap:7px!important;overflow-x:auto!important;padding-bottom:4px!important;scrollbar-width:thin;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
  .gm2225-settings-tabs>button{flex:0 0 min(220px,76vw)!important;min-width:0!important;min-height:68px!important;scroll-snap-align:start!important;padding:10px 12px!important}
  .panel-head,.gb-section-head,.gm-module-head{min-width:0!important;flex-wrap:wrap!important}
  .panel-head>*{min-width:0}
  .toolbar{max-width:100%!important}
  .toolbar input,.toolbar select{min-width:0!important;max-width:100%!important}
}

@media (max-width:600px){
  .gm-tenant-sidebar{padding-top:max(18px,env(safe-area-inset-top))!important}
  .gm-brand-box img{width:82px!important;max-width:82px!important;height:48px!important;max-height:48px!important;flex-basis:82px}
  .gm-brand-name{max-width:calc(100vw - 132px);font-size:13.5px!important}
  .gm-tenant-nav{gap:6px!important}
  .gm-tenant-nav button{min-height:42px!important;padding:8px 11px!important;font-size:12.5px!important;border-radius:11px!important}
  .gm-nav-icon,.gm-nav-icon svg{width:18px;height:18px}.gm-nav-icon{flex-basis:18px}
  .gm-tenant-shell .tenant-header{align-items:flex-start!important;flex-direction:column!important;padding:13px 14px!important;gap:9px!important}
  .tenant-header .brand{max-width:100%;font-size:clamp(20px,6vw,27px)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .tenant-header .company{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%}
  .gm-tenant-shell .tenant-header .toolbar{width:100%!important;display:flex!important;justify-content:space-between!important;align-items:center!important;overflow:visible!important;flex-wrap:wrap!important;gap:9px!important}
  .gm-tenant-shell .tenant-header .toolbar>span{min-width:0;max-width:calc(100% - 118px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .gm-tenant-shell .tenant-content{padding:10px!important}
  .grid2,.grid3,.gard-license-grid{grid-template-columns:minmax(0,1fr)!important}
  .gm-module-view,.panel,.gb-section{border-radius:12px!important}
  .panel-head,.panel-body,.gb-section-head,.gb-section-body{padding-left:13px!important;padding-right:13px!important}
  .gm2225-settings-tabs>button{flex-basis:min(194px,78vw)!important;min-height:56px!important;grid-template-areas:"num title"!important;grid-template-rows:1fr!important}
  .gm2225-settings-tabs>button>small{display:none!important}
  .gm2225-settings-tabs>button>b{white-space:normal!important;line-height:1.15!important;display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .table-wrap{border-radius:9px!important}
  .modal-backdrop,.gb-modal-backdrop{padding:9px!important}
  .modal,.gb-modal{width:100%!important;max-width:100%!important;max-height:calc(100dvh - 18px)!important;border-radius:14px!important}
}

@media (max-width:480px){
  .login-page{padding-left:10px!important;padding-right:10px!important;background:linear-gradient(180deg,#08142B 0 118px,#eef3f9 118px 100%)!important}
  .login-card{padding:20px 18px!important;border-radius:17px!important}
  .login-card>.gm-login-logo{width:min(170px,46vw)!important;max-width:46vw!important;max-height:118px!important;margin-bottom:14px!important}
  .login-card .eyebrow{font-size:10px!important}
  .login-card .brand{font-size:clamp(26px,8vw,33px)!important;margin-top:6px!important}
  .login-card .sub{font-size:15px!important;margin-bottom:15px!important}
  .gm-tenant-nav button{min-height:40px!important;padding:8px 10px!important;font-size:12px!important}
  .gm-module-head h2{font-size:20px!important}
  .gard-license-card{padding:14px!important}
}
