/* IT TOP Solutions Company — final non-breaking visual polish.
   Loaded last; intentionally limited to layout, accessibility, and responsive behavior. */
:root{
  --p1-focus:#f6cf72;
  --p1-surface:#0b1628;
  --p1-border:rgba(148,163,184,.20);
}
html{scroll-behavior:smooth}
body{min-width:0;overflow-x:hidden}
button,a,input,select,textarea{font:inherit}
button,a,[role="button"],input,select,textarea{outline:none}
button:focus-visible,a:focus-visible,[role="button"]:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid color-mix(in srgb,var(--p1-focus) 76%,white 24%)!important;
  outline-offset:3px!important;
  box-shadow:0 0 0 5px rgba(246,207,114,.14)!important;
}
button:disabled,[aria-disabled="true"]{cursor:not-allowed!important;opacity:.58!important;filter:saturate(.65)}
img,svg,canvas,video{max-width:100%}
pre,code,.mono{overflow-wrap:anywhere}
.table-wrap,.table-container,.overflow-x-auto{overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}

/* Login: remove the nonessential third action and balance the card on smaller screens. */
#loginView .it-login-shell{align-items:stretch}
#loginView .it-login-side,#loginView .it-login-panel{min-width:0}
#loginView #focusUserBtn{display:none!important}
#loginView .it-link-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}
#loginView .it-input{min-width:0}
#loginView .it-msg:empty{min-height:0;margin-top:0}
#loginView .it-msg:not(:empty){margin-top:12px;min-height:22px}
#loginView .it-meta{line-height:1.7}
#loginView .copyright-link{display:inline-block;padding:8px 4px}

/* Activation: consistent Arabic presentation and less visual density. */
#activationView .activation-frame{min-width:0}
#activationView .activation-brand-panel,#activationView .activation-card-pro{min-width:0}
#activationView .activation-info-card{min-width:0}
#activationView .activation-info-card strong{overflow-wrap:anywhere}
#activationView .activation-actions-grid>a,#activationView .activation-actions-grid>button{min-height:48px}

/* Application shell and dense pages. */
#appView.app-shell{width:100%;min-width:0}
#appView>*,#appView .card,#appView .section-shell{min-width:0}
#appView .nav-btn,#appView .sidebar-user-action,#appView .sidebar-logout{min-height:44px}
#appView .action-btn,#appView .row-btn,#appView button{touch-action:manipulation}
#appView table{font-variant-numeric:tabular-nums}
#appView .toast{max-width:min(420px,calc(100vw - 28px));min-width:0!important;overflow-wrap:anywhere}

@media(max-width:1180px){
  #appView.app-shell{grid-template-columns:280px minmax(0,1fr)!important;gap:14px!important}
}
@media(max-width:1024px){
  #appView.app-shell{display:block!important;padding:10px!important}
  #appView .app-sidebar{max-height:none}
  #appView .dashboard-toolbar-actions,#appView .row-actions,#appView .backup-action-row{gap:8px;flex-wrap:wrap}
  #appView .dashboard-toolbar-actions>*{flex:1 1 120px}
}
@media(max-width:640px){
  #loginView.it-login-lux{padding:10px!important;align-items:flex-start!important;overflow:auto!important}
  #loginView .it-login-shell{gap:12px!important}
  #loginView .it-login-side{padding:20px 17px!important}
  #loginView .it-login-panel{padding:22px 17px!important}
  #loginView .it-login-side h1{font-size:27px!important;line-height:1.25!important}
  #loginView .it-login-side p{font-size:14px!important;line-height:1.75!important}
  #loginView .it-logo-badge{width:86px!important;height:86px!important;border-radius:24px!important;margin-bottom:16px!important}
  #loginView .it-logo-badge img{max-width:66px!important;max-height:66px!important}
  #loginView .it-stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}
  #loginView .it-stat{padding:10px 6px!important;text-align:center}
  #loginView .it-stat strong{font-size:16px!important}
  #loginView .it-stat span{font-size:10px!important}
  #loginView .it-options{grid-template-columns:1fr 1fr!important;gap:8px!important}
  #loginView .it-save-btn{grid-column:1/-1;width:100%}
  #loginView .it-link-row{grid-template-columns:1fr!important}
  #loginView .it-input,#loginView .it-login-submit{height:52px!important}
  #activationView{padding-inline:10px!important}
  #activationView .activation-brand-panel,#activationView .activation-card-pro{padding:20px 16px!important}
  #activationView .activation-info-grid{grid-template-columns:1fr!important}
  #activationView .activation-actions-grid{grid-template-columns:1fr!important}
  #appView.app-shell{padding:8px!important}
  #appView .card,#appView .section-shell{border-radius:16px!important}
  #appView .grid.grid-cols-2{gap:8px!important}
  #appView .panel-title{font-size:1.25rem!important}
  #appView .action-btn,#appView .row-btn{min-height:42px}
  #appView table{min-width:620px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
@media(prefers-contrast:more){
  .card,.section-shell,.it-login-side,.it-login-panel{border-color:rgba(255,255,255,.30)!important}
  .text-slate-400,.text-slate-500{color:#d1d5db!important}
}