/* IZZY UI Standards · local-only shared visual rules */
:root{
  --ui-navy:#0B1F52;
  --ui-blue:#1098EA;
  --ui-cobalt:#114BC7;
  --ui-cyan:#1FC3F3;
  --ui-soft:#EAF5FC;
  --ui-soft-2:#DDEFFA;
  --ui-line:#D7E3EC;
  --ui-text:#17314F;
  --ui-muted:#6E8195;
}

/* Buttons must never become white or washed-out on hover. */
.button.secondary,
.btn.secondary,
.btn-outline,
.btn.outline,
.swal2-cancel,
.cms-modal-button.secondary{
  background:var(--ui-soft)!important;
  color:var(--ui-navy)!important;
  border-color:#C6DEED!important;
  opacity:1!important;
  filter:none!important;
}
.button.secondary:hover,
.btn.secondary:hover,
.btn-outline:hover,
.btn.outline:hover,
.swal2-cancel:hover,
.cms-modal-button.secondary:hover{
  background:var(--ui-soft-2)!important;
  color:var(--ui-navy)!important;
  border-color:#AFCFE3!important;
  opacity:1!important;
  filter:none!important;
}
button:hover,
a.button:hover,
a.btn:hover,
.quick-link:hover,
.icon-btn:hover,
.manage-card:hover,
.stat:hover,
.traffic-card:hover,
.attention-card:hover,
.request-card:hover{
  opacity:1!important;
  filter:none!important;
}

/* Consistent icon + text alignment for actions. */
.ui-action-icon{
  width:17px;
  height:17px;
  flex:0 0 17px;
  display:inline-block;
  vertical-align:-3px;
}
.ui-action-icon path,
.ui-action-icon circle,
.ui-action-icon polyline,
.ui-action-icon line,
.ui-action-icon rect{
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* Local Select2-compatible control, normalized across installer/public/admin. */
.s2-container{
  font-family:inherit!important;
}
.s2-selection{
  min-height:46px!important;
  background:#F8FBFD!important;
  color:var(--ui-text)!important;
  border:1px solid var(--ui-line)!important;
  border-radius:12px!important;
  box-shadow:none!important;
  font-weight:650!important;
}
.s2-selection:hover{
  background:#F3F8FC!important;
  border-color:#AFC9DB!important;
  color:var(--ui-text)!important;
  opacity:1!important;
}
.s2-container.open .s2-selection,
.s2-selection:focus{
  background:#fff!important;
  border-color:var(--ui-blue)!important;
  box-shadow:0 0 0 3px rgba(16,152,234,.11)!important;
}
.s2-dropdown{
  border-color:#C8D9E5!important;
  border-radius:13px!important;
  box-shadow:0 18px 44px rgba(11,31,82,.16)!important;
}
.s2-option:hover,
.s2-option.active{
  background:#E8F4FB!important;
  color:var(--ui-navy)!important;
  opacity:1!important;
}
.s2-option.selected{
  background:#E2F3FB!important;
  color:#066F9E!important;
  font-weight:800!important;
  box-shadow:inset 3px 0 0 #0A9FD3!important;
}

/* Universal premium upload zone for raw file inputs. */
.ui-file-input-hidden{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  margin:-1px!important;
  padding:0!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  white-space:nowrap!important;
  border:0!important;
}
.ui-file-zone{
  position:relative;
  display:grid;
  grid-template-columns:44px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  width:100%;
  min-height:78px;
  margin-top:8px;
  padding:13px 14px;
  border:1px dashed #AFC9DB;
  border-radius:14px;
  background:#F7FBFE;
  color:var(--ui-text);
  cursor:pointer;
  transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease;
}
.ui-file-zone:hover,
.ui-file-zone.is-dragging{
  background:#EEF7FC;
  border-color:var(--ui-blue);
  color:var(--ui-text);
  opacity:1;
  transform:translateY(-1px);
  box-shadow:0 8px 22px rgba(11,31,82,.07);
}
.ui-file-zone-icon{
  width:44px;
  height:44px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:#E7F4FB;
  color:var(--ui-blue);
}
.ui-file-zone-icon svg{width:21px;height:21px}
.ui-file-zone-copy{min-width:0}
.ui-file-zone-copy strong{display:block;font-size:13px;font-weight:800;color:var(--ui-navy)}
.ui-file-zone-copy small{display:block;margin-top:3px;color:var(--ui-muted);font-size:11px;line-height:1.4;overflow-wrap:anywhere}
.ui-file-zone-button{
  min-height:38px!important;
  padding:8px 12px!important;
  border:0!important;
  border-radius:10px!important;
  background:var(--ui-navy)!important;
  color:#fff!important;
  font:inherit!important;
  font-size:12px!important;
  font-weight:800!important;
  box-shadow:none!important;
}
.ui-file-zone-button:hover{background:var(--ui-cobalt)!important;color:#fff!important;opacity:1!important}
.ui-file-list{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.ui-file-chip{display:inline-flex;align-items:center;max-width:100%;padding:5px 8px;border-radius:999px;background:#EAF3F9;color:#36536E;font-size:10.5px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Admin KPI motion/readability standard. */
.stat,
.traffic-card,
.attention-card{
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease!important;
}
.stat:hover,
.traffic-card:hover,
.attention-card:hover{
  transform:translateY(-3px)!important;
  box-shadow:0 14px 30px rgba(11,31,82,.10)!important;
  border-color:#BFD5E4!important;
}
.stat strong,
.traffic-card strong{
  color:var(--ui-navy)!important;
  letter-spacing:-.02em;
}

/* Premium notification danger alias. */
.notify-item.danger .notify-icon{background:#FCECED;color:#992F34}

@media(max-width:640px){
  .ui-file-zone{grid-template-columns:40px minmax(0,1fr);padding:12px}
  .ui-file-zone-button{grid-column:1/-1;width:100%}
}


/* Global premium action standard: clickable buttons are never white. */
button:not(.notify-close):not(.modal-close):not(.password-toggle):not(.icon-btn):not(.s2-option),
input[type="submit"],
input[type="button"],
input[type="reset"]{
  opacity:1;
  filter:none;
}
button.secondary,
button.ghost,
button.soft,
button.light,
.btn.ghost,
.btn.light,
.button.ghost,
.button.light{
  background:var(--ui-soft)!important;
  color:var(--ui-navy)!important;
  border-color:#C6DEED!important;
}
button.secondary:hover,
button.ghost:hover,
button.soft:hover,
button.light:hover,
.btn.ghost:hover,
.btn.light:hover,
.button.ghost:hover,
.button.light:hover{
  background:var(--ui-soft-2)!important;
  color:var(--ui-navy)!important;
  opacity:1!important;
  filter:none!important;
}

/* Dialogs retain visual strength and only close through explicit actions / Escape. */
.swal2-popup,
.cms-modal-dialog{font-family:inherit!important}
.swal2-confirm,
.cms-modal-button.primary{background:var(--ui-navy)!important;color:#fff!important}
.swal2-confirm:hover,
.cms-modal-button.primary:hover{background:var(--ui-cobalt)!important;color:#fff!important;opacity:1!important}

/* Readability for KPI surfaces without washing them out on hover. */
.stat:hover *,
.traffic-card:hover *,
.attention-card:hover *{opacity:1!important}

/* Close/toggle controls are action buttons too: never white. */
.lightbox-close,
.modal-close,
.password-toggle,
.menu-toggle{
  background:var(--ui-soft)!important;
  color:var(--ui-navy)!important;
  border-color:#C6DEED!important;
  opacity:1!important;
  filter:none!important;
}
.lightbox-close:hover,
.modal-close:hover,
.password-toggle:hover,
.menu-toggle:hover{
  background:var(--ui-soft-2)!important;
  color:var(--ui-navy)!important;
  border-color:#AFCFE3!important;
  opacity:1!important;
  filter:none!important;
}

/* IZZY v1.0.74 · SweetAlert2 viewport centering across the entire project */
html.swal2-shown,
body.swal2-shown{
  min-height:100%!important;
}
body > .swal2-container,
.swal2-container{
  position:fixed!important;
  top:0!important;
  right:0!important;
  bottom:0!important;
  left:0!important;
  inset:0!important;
  width:100vw!important;
  max-width:100vw!important;
  height:100vh!important;
  height:100dvh!important;
  max-height:100dvh!important;
  margin:0!important;
  padding:max(12px,env(safe-area-inset-top,0px)) max(12px,env(safe-area-inset-right,0px)) max(12px,env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px))!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  place-items:center!important;
  box-sizing:border-box!important;
  overflow:auto!important;
  transform:none!important;
}
body > .swal2-container > .swal2-popup,
.swal2-container > .swal2-popup{
  position:relative!important;
  inset:auto!important;
  margin:auto!important;
  max-width:calc(100vw - 24px)!important;
  max-height:calc(100dvh - 24px)!important;
  box-sizing:border-box!important;
}
@supports not (height:100dvh){
  body > .swal2-container,
  .swal2-container{height:100vh!important;max-height:100vh!important}
  body > .swal2-container > .swal2-popup,
  .swal2-container > .swal2-popup{max-height:calc(100vh - 24px)!important}
}
@media(max-width:460px){
  body > .swal2-container,
  .swal2-container{padding:10px!important}
  body > .swal2-container > .swal2-popup,
  .swal2-container > .swal2-popup{max-width:calc(100vw - 20px)!important;max-height:calc(100dvh - 20px)!important}
}

/* IZZY v1.0.73 · SweetAlert2 action readability across project */
.swal2-confirm,.swal2-cancel{min-height:46px!important;max-width:100%!important;padding:10px 17px!important;font-size:14px!important;line-height:1.22!important;font-weight:900!important;letter-spacing:0!important;white-space:normal!important;overflow-wrap:anywhere!important;text-align:center!important;-webkit-font-smoothing:antialiased!important;text-rendering:geometricPrecision!important}
.swal2-actions{max-width:100%!important}
.swal2-confirm .action-icon,.swal2-cancel .action-icon{width:18px!important;height:18px!important;flex:0 0 18px!important}
@media(max-width:460px){.swal2-confirm,.swal2-cancel{width:100%!important;font-size:13.5px!important;padding:10px 12px!important}}

/* IZZY v1.0.76 · enlaces sin subrayado en sitio publicado y componentes compartidos */
a,
a:link,
a:visited,
a:hover,
a:focus,
a:focus-visible,
a:active{
    text-decoration:none!important;
}


/* IZZY v1.0.78 · campos de contraseña con ojito propio + frases de confirmación destacadas */
input[type="password"]::-ms-reveal,
input[type="password"]::-ms-clear{
  display:none!important;
}
input[type="password"]::-webkit-credentials-auto-fill-button,
input[type="password"]::-webkit-contacts-auto-fill-button{
  visibility:hidden!important;
  display:none!important;
  pointer-events:none!important;
  position:absolute!important;
  right:0!important;
}
.ui-password-wrap{
  position:relative!important;
  display:block!important;
  width:100%!important;
  min-width:0!important;
}
.ui-password-wrap > input[type="password"],
.ui-password-wrap > input[type="text"][data-ui-password-visible="1"]{
  width:100%!important;
  max-width:100%!important;
  padding-right:54px!important;
}
.ui-password-toggle{
  position:absolute!important;
  top:50%!important;
  right:8px!important;
  transform:translateY(-50%)!important;
  z-index:3!important;
  width:34px!important;
  min-width:34px!important;
  height:34px!important;
  min-height:34px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  border:1px solid #c6deed!important;
  border-radius:9px!important;
  background:#eef8fd!important;
  color:var(--ui-navy)!important;
  box-shadow:none!important;
  cursor:pointer!important;
  opacity:1!important;
  filter:none!important;
}
.ui-password-toggle:hover,
.ui-password-toggle:focus-visible{
  background:var(--ui-soft-2)!important;
  border-color:#afcfe3!important;
  color:var(--ui-cobalt)!important;
  transform:translateY(-50%)!important;
}
.ui-password-toggle:focus-visible{
  outline:3px solid rgba(16,152,234,.18)!important;
  outline-offset:2px!important;
}
.ui-password-toggle svg{
  width:17px!important;
  height:17px!important;
  display:block!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.9!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.ui-password-toggle .ui-eye-off{display:none!important}
.ui-password-toggle[aria-pressed="true"] .ui-eye{display:none!important}
.ui-password-toggle[aria-pressed="true"] .ui-eye-off{display:block!important}

/* Campos que ya traen el control de contraseña del instalador no se duplican. */
.password-wrap > input[type="password"]::-ms-reveal,
.password-wrap > input[type="password"]::-ms-clear{display:none!important}

.field-caption-inline{
  display:flex!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  gap:6px!important;
  min-width:0!important;
  white-space:nowrap!important;
  line-height:1.35!important;
}

.confirmation-required-phrase,
[data-confirm-text] label strong{
  display:inline-flex!important;
  align-items:center!important;
  max-width:100%!important;
  margin:0 3px!important;
  padding:2px 7px!important;
  border:1px solid #b9dff0!important;
  border-radius:7px!important;
  background:#eaf7fd!important;
  color:#0877a8!important;
  font-weight:900!important;
  line-height:1.35!important;
  letter-spacing:.01em!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  white-space:nowrap!important;
  vertical-align:middle!important;
}

@media(max-width:520px){
  .field-caption-inline{
    gap:5px!important;
    font-size:12px!important;
  }
  .confirmation-required-phrase{
    padding:2px 6px!important;
    font-size:11.5px!important;
  }
  .ui-password-toggle{
    right:6px!important;
    width:32px!important;
    min-width:32px!important;
    height:32px!important;
    min-height:32px!important;
  }
}

/* keep normal flow after mobile rules */
@media(max-width:520px){
  .ui-password-toggle{
    width:34px!important;
    min-width:34px!important;
    height:34px!important;
    min-height:34px!important;
    right:6px!important;
  }
  .ui-password-wrap > input[type="password"],
  .ui-password-wrap > input[type="text"][data-ui-password-visible="1"]{
    padding-right:50px!important;
  }
  .confirmation-required-phrase,
  [data-confirm-text] label strong{
    white-space:normal!important;
  }
}