
/* WIBLIV responsive design layer — presentation only; no route or data changes */
:root {
  --wa-red:#d7192d; --wa-red-dark:#b91426; --wa-ink:#172235;
  --wa-muted:#66748a; --wa-line:#e5eaf2; --wa-bg:#f4f6fa;
  --wa-card:#fff; --wa-soft:#fff0f2; --wa-shadow:0 8px 28px rgba(21,34,55,.055);
}
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body { font-family:Inter,"Segoe UI",Arial,sans-serif !important; color:var(--wa-ink) !important; background:var(--wa-bg) !important; }
button, input, select, textarea { font:inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color:transparent; }
a { transition:color .18s ease, background-color .18s ease, border-color .18s ease; }
:where(button,a,input,select,textarea):focus-visible { outline:3px solid rgba(215,25,45,.25); outline-offset:2px; }
img { max-width:100%; }
table { border-color:var(--wa-line); }
th { letter-spacing:.035em; }
input,select,textarea { max-width:100%; }
button, .btn { min-height:42px; }
main { min-width:0; }
.panel,.card,.stat,.stat-card,.hierarchy-stat,.hierarchy-toolbar,.hierarchy-board,.employee-directory {
  border-radius:15px !important; box-shadow:var(--wa-shadow);
}
input,select,textarea {
  border-color:#d8e0eb !important; border-radius:10px !important;
}
input:focus,select:focus,textarea:focus {
  border-color:var(--wa-red) !important; box-shadow:0 0 0 3px rgba(215,25,45,.09) !important; outline:0;
}
.btn,button,.hierarchy-btn {
  border-radius:10px !important; transition:transform .16s ease,box-shadow .16s ease,background .16s ease;
}
.btn-primary,.btn:not(.secondary):not(.btn-light):not(.btn-danger),.hierarchy-btn:not(.secondary) {
  background:var(--wa-red); border-color:var(--wa-red); color:#fff;
}
.btn-primary:hover,.btn:not(.secondary):not(.btn-light):not(.btn-danger):hover,.hierarchy-btn:not(.secondary):hover {
  background:var(--wa-red-dark); border-color:var(--wa-red-dark); color:#fff;
}
.sidebar { box-shadow:3px 0 22px rgba(20,30,50,.025); }
.sidebar .nav-link { min-height:44px; border-radius:10px; }
.sidebar .nav-link.active { background:var(--wa-soft); color:var(--wa-red); }
.topbar { backdrop-filter:blur(12px); }
.employee-page .stat,.employee-page .employee-directory { border-radius:15px; }
.employee-page .stats,.hierarchy-stats,.stats { gap:14px; }
.employee-page th,.hierarchy-page th { color:#69768b; }
.employee-page tbody tr:hover,.hierarchy-page tbody tr:hover { background:#fff9fa; }
.employee-page .actions { gap:7px; }
.employee-page .actions form { margin:0; }
.employee-form-panel,.employee-form-panel .grid { min-width:0; }
.employee-form-panel input,.employee-form-panel select,.employee-form-panel textarea { min-height:46px; }
.employee-form-panel textarea { width:100%; }
.hierarchy-page { width:100%; }
.hierarchy-board { background:#f8faff !important; }
.hierarchy-stat strong { letter-spacing:-.04em; }
.hierarchy-filters { min-width:0; }
.hierarchy-filters input,.hierarchy-filters select { min-height:44px; }
.table-wrap { max-width:100%; -webkit-overflow-scrolling:touch; }
body > header { position:relative; }
body > header a { text-decoration:none; }
.notice,.success,.error { line-height:1.55; }
.pagination { overflow-x:auto; }
.wa-muted { color:var(--wa-muted); }

@media (max-width: 900px) {
  .hierarchy-page { padding:22px 18px !important; }
  .hierarchy-stats { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .hierarchy-filters { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .hierarchy-filters input { grid-column:1/-1; }
  .employee-page { padding:24px 18px 34px !important; }
  .employee-page .stats,.stats { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width: 640px) {
  body { font-size:14px; }
  body > header { padding:13px 16px !important; gap:10px !important; }
  main { margin-top:20px !important; }
  .hierarchy-page { padding:18px 12px !important; }
  .hierarchy-heading { align-items:flex-start !important; }
  .hierarchy-heading h1 { font-size:24px !important; }
  .hierarchy-stats { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px !important; }
  .hierarchy-stat { padding:15px !important; }
  .hierarchy-stat strong { font-size:24px !important; }
  .hierarchy-toolbar { padding:12px !important; }
  .hierarchy-filters { grid-template-columns:1fr !important; gap:9px !important; }
  .hierarchy-filters input { grid-column:auto; }
  .hierarchy-btn { width:100%; white-space:normal !important; }
  .hierarchy-board { padding:12px !important; overflow-x:auto !important; }
  .hierarchy-board > * { min-width:0; }
  .employee-page { padding:20px 12px 28px !important; }
  .employee-page .page-head { flex-direction:column; align-items:stretch !important; gap:14px !important; }
  .employee-page .page-head > .btn { width:100%; }
  .employee-page .stats,.stats { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px !important; }
  .employee-page .stat,.stat { padding:14px !important; min-width:0; }
  .employee-page .stat-number,.stat strong { font-size:23px !important; }
  .employee-page .employee-directory { border-radius:13px !important; }
  .employee-page .panel-head { padding:16px !important; align-items:flex-start !important; }
  .employee-page .table-wrap { overflow:visible !important; padding:0 12px 12px !important; }
  .employee-page table { min-width:680px; }
  .employee-page th,.employee-page td { padding:12px 10px !important; }
  .employee-form-main { padding:18px 12px 30px !important; }
  .employee-form-panel { padding:16px !important; }
  .employee-form-panel .grid { grid-template-columns:1fr !important; gap:15px !important; }
  .employee-form-panel .field.full { grid-column:auto !important; }
  .employee-form-footer { align-items:stretch !important; }
  .employee-form-footer .form-actions { display:grid !important; grid-template-columns:1fr !important; }
  .employee-form-footer .form-actions .btn { width:100%; }
  .container { width:100%; margin:12px auto !important; padding:12px !important; }
  .container .card { padding:16px !important; border-radius:14px !important; }
  .container table { min-width:620px; }
  body > main:not(.employee-form-main):not(.employee-page):not(.wa-main) { width:auto; margin:20px 12px !important; padding:0 !important; }
  .panel { padding:17px !important; }
  .grid { grid-template-columns:1fr !important; }
  .field.full { grid-column:auto !important; }
  .actions { flex-wrap:wrap; }
  .actions .btn, form .btn { min-height:44px; }
  .filters { align-items:stretch !important; }
  .filters .field { min-width:100% !important; }
  .tabs { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tabs .btn { text-align:center; padding:10px 8px !important; }
  .table-wrap table { min-width:760px; }
  .pagination { justify-content:flex-start !important; }
}
@media (max-width: 380px) {
  .hierarchy-stats,.employee-page .stats,.stats { grid-template-columns:1fr !important; }
  .admin-chip { max-width:180px; overflow-wrap:anywhere; }
}

/* Admin overview */
.wa-dashboard { min-height:100vh; background:#f4f6fa !important; }
.wa-topbar { min-height:76px; padding:12px clamp(16px,4vw,56px) !important; display:flex; align-items:center; justify-content:space-between; gap:18px; background:#fff; border-bottom:1px solid #e7ebf2; }
.wa-brand { display:flex; align-items:center; }
.wa-brand img { width:128px; height:44px; object-fit:contain; }
.wa-top-actions { display:flex; align-items:center; gap:20px; }
.wa-top-actions form { margin:0; }
.wa-admin-profile { display:flex; align-items:center; gap:11px; }
.wa-avatar { display:grid; place-items:center; width:40px; height:40px; border-radius:13px; background:#fff0f2; color:#d7192d; font-weight:800; }
.wa-profile-copy { display:grid; gap:4px; }
.wa-profile-copy strong { font-size:12px; }
.wa-profile-copy small { color:#788397; font-size:11px; }
.wa-signout { min-height:40px; padding:9px 14px; border:1px solid #f1d5d9; border-radius:10px; background:#fff; color:#c51d30; font-size:12px; font-weight:750; cursor:pointer; }
.wa-signout:hover { background:#fff1f3; }
.wa-main { width:min(1280px,92%); margin:30px auto 0 !important; padding:0 0 24px !important; }
.wa-breadcrumb { margin-bottom:22px; color:#79859a; font-size:12px; }
.wa-breadcrumb span { margin:0 7px; color:#c1c8d3; }
.wa-welcome { position:relative; display:flex; align-items:center; justify-content:space-between; gap:25px; min-height:225px; padding:clamp(25px,4vw,42px); overflow:hidden; border-radius:20px; background:linear-gradient(115deg,#c91329 0%,#dc1d32 58%,#ed4858 100%); color:#fff; box-shadow:0 16px 38px rgba(194,18,40,.15); }
.wa-welcome-copy { position:relative; z-index:2; max-width:660px; }
.wa-eyebrow { display:block; margin-bottom:13px; color:rgba(255,255,255,.8); font-size:10px; font-weight:800; letter-spacing:1.7px; }
.wa-welcome h1 { margin:0; font-size:clamp(26px,3vw,36px); line-height:1.2; letter-spacing:-1px; }
.wa-welcome p { max-width:560px; margin:12px 0 22px; color:rgba(255,255,255,.88); font-size:14px; line-height:1.7; }
.wa-primary-link { display:inline-flex; align-items:center; gap:18px; padding:11px 15px; border:1px solid rgba(255,255,255,.45); border-radius:10px; color:#fff; background:rgba(255,255,255,.12); text-decoration:none; font-size:12px; font-weight:750; }
.wa-primary-link:hover { background:#fff; color:#c91329; }
.wa-welcome-art { position:relative; flex:0 0 260px; height:165px; }
.wa-art-circle { position:absolute; top:22px; right:66px; display:grid; place-items:center; width:100px; height:100px; border:1px solid rgba(255,255,255,.3); border-radius:30px; background:rgba(255,255,255,.13); color:#fff; font-size:40px; font-weight:900; transform:rotate(-8deg); }
.wa-art-card { position:absolute; z-index:2; width:110px; padding:13px; border:1px solid rgba(255,255,255,.55); border-radius:12px; background:#fff; box-shadow:0 12px 25px rgba(94,0,13,.15); }
.wa-art-card-one { top:5px; right:8px; transform:rotate(7deg); }
.wa-art-card-two { bottom:2px; left:0; transform:rotate(-6deg); }
.wa-art-dot { display:block; width:17px; height:17px; margin-bottom:10px; border-radius:6px; background:#ffe4e8; }
.wa-art-card i { display:block; height:5px; margin-top:6px; border-radius:5px; background:#e9edf3; }
.wa-art-card i:nth-of-type(1) { width:80%; }.wa-art-card i:nth-of-type(2) { width:60%; }.wa-art-card i:nth-of-type(3) { width:72%; }
.wa-art-bars { display:flex; align-items:flex-end; gap:6px; height:48px; }
.wa-art-bars i { display:block; flex:1; border-radius:4px 4px 1px 1px; background:#f6b5be; }
.wa-art-bars i:nth-child(1) { height:35%; }.wa-art-bars i:nth-child(2) { height:65%; }.wa-art-bars i:nth-child(3) { height:48%; }.wa-art-bars i:nth-child(4) { height:90%; background:#d7192d; }.wa-art-bars i:nth-child(5) { height:72%; }
.wa-section { margin-top:32px; }
.wa-section-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; }
.wa-section-heading h2,.wa-panel-heading h2 { margin:0; font-size:18px; letter-spacing:-.35px; }
.wa-section-heading p,.wa-panel-heading p { margin:6px 0 0; color:#7a869a; font-size:12px; line-height:1.6; }
.wa-section-tag { display:flex; align-items:center; gap:8px; padding:8px 11px; border:1px solid #e2e8f1; border-radius:9px; background:#fff; color:#69768b; font-size:11px; white-space:nowrap; }
.wa-section-tag span,.wa-security-status span { width:7px; height:7px; border-radius:50%; background:#22a06b; }
.wa-module-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:17px; }
.wa-module-card { position:relative; display:flex; min-width:0; min-height:230px; flex-direction:column; align-items:flex-start; padding:22px; border:1px solid #e5eaf2; border-radius:16px; background:#fff; color:inherit; text-decoration:none; box-shadow:0 5px 18px rgba(21,34,55,.025); transition:transform .2s,border-color .2s,box-shadow .2s; }
.wa-module-card:hover { transform:translateY(-3px); border-color:#f0bfc6; box-shadow:0 12px 28px rgba(21,34,55,.075); }
.wa-module-icon { display:grid; place-items:center; width:46px; height:46px; border-radius:13px; font-size:22px; font-weight:800; }
.wa-icon-red { background:#fff0f2; color:#d7192d; }.wa-icon-blue { background:#edf4ff; color:#3469b9; }.wa-icon-violet { background:#f3efff; color:#7556c7; }.wa-icon-green { background:#eaf8f0; color:#198457; }.wa-icon-amber { background:#fff5e6; color:#a66a10; }
.wa-module-number { position:absolute; top:27px; right:23px; color:#a8b1c0; font-size:10px; font-weight:800; letter-spacing:1px; }
.wa-module-card > strong { margin-top:18px; font-size:15px; letter-spacing:-.2px; }
.wa-module-desc { margin-top:8px; color:#718096; font-size:12px; line-height:1.75; }
.wa-module-action { display:flex; align-items:center; justify-content:space-between; gap:15px; width:100%; margin-top:auto; padding-top:18px; color:#d7192d; font-size:12px; font-weight:800; }
.wa-module-action b { display:grid; place-items:center; width:26px; height:26px; border-radius:8px; background:#fff0f2; font-size:15px; }
.wa-bottom-grid { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(240px,1fr); gap:17px; margin-top:20px; }
.wa-info-panel { min-width:0; padding:22px; border:1px solid #e5eaf2; border-radius:16px; background:#fff; box-shadow:0 5px 18px rgba(21,34,55,.025); }
.wa-panel-heading { display:flex; justify-content:space-between; gap:15px; align-items:flex-start; }
.wa-panel-symbol { display:grid; place-items:center; width:34px; height:34px; border-radius:10px; background:#f4f6fa; color:#64748b; }
.wa-workflow { display:flex; align-items:center; gap:10px; margin-top:23px; }
.wa-workflow-step { display:grid; flex:1; min-width:0; gap:6px; padding:13px 12px; border:1px solid #e8edf4; border-radius:11px; background:#fbfcfe; }
.wa-workflow-step span { color:#d7192d; font-size:10px; font-weight:800; }
.wa-workflow-step b { font-size:12px; }
.wa-workflow-step small { color:#7a869a; font-size:10px; line-height:1.5; }
.wa-workflow-arrow { color:#b4bdca; }
.wa-hint { margin:15px 0 0; color:#8a95a7; font-size:10px; line-height:1.6; }
.wa-security-panel { display:flex; flex-direction:column; align-items:flex-start; }
.wa-security-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:13px; background:#eaf8f0; color:#198457; font-size:21px; font-weight:800; }
.wa-security-panel h2 { margin:17px 0 0; font-size:16px; }
.wa-security-panel p { margin:8px 0 15px; color:#718096; font-size:12px; line-height:1.7; }
.wa-security-status { display:flex; align-items:center; gap:8px; color:#198457; font-size:11px; font-weight:750; }
.wa-security-panel > a { margin-top:auto; padding-top:20px; color:#d7192d; font-size:12px; font-weight:800; text-decoration:none; }
.wa-footer { display:flex; justify-content:space-between; gap:15px; padding:24px 2px 8px; color:#98a2b3; font-size:10px; }
@media(max-width:980px) { .wa-module-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .wa-welcome-art { flex-basis:200px; transform:scale(.9); transform-origin:right center; } }
@media(max-width:650px) {
 .wa-topbar { padding:12px 15px !important; min-height:66px; }
 .wa-brand img { width:108px; height:38px; }
 .wa-top-actions { gap:9px; }
 .wa-profile-copy { display:none; }
 .wa-avatar { width:36px; height:36px; }
 .wa-signout { padding:8px 10px; min-height:38px; }
 .wa-main { width:auto; margin:20px 13px 0 !important; padding-bottom:16px !important; }
 .wa-breadcrumb { margin-bottom:15px; font-size:11px; }
 .wa-welcome { min-height:0; padding:24px 20px; border-radius:16px; }
 .wa-welcome h1 { font-size:26px; }
 .wa-welcome p { font-size:13px; }
 .wa-welcome-art { display:none; }
 .wa-section { margin-top:25px; }
 .wa-section-heading { align-items:flex-start; }
 .wa-section-heading h2 { font-size:17px; }
 .wa-section-tag { display:none; }
 .wa-module-grid { grid-template-columns:1fr; gap:12px; }
 .wa-module-card { min-height:0; padding:18px; display:grid; grid-template-columns:46px minmax(0,1fr); column-gap:13px; align-items:center; }
 .wa-module-icon { grid-column:1; grid-row:1 / span 2; }
 .wa-module-number { top:17px; right:17px; }
 .wa-module-card > strong { grid-column:2; margin:0; padding-right:25px; font-size:14px; }
 .wa-module-desc { grid-column:2; margin-top:5px; font-size:11px; }
 .wa-module-action { grid-column:2; padding-top:12px; font-size:11px; }
 .wa-module-action b { width:23px; height:23px; }
 .wa-bottom-grid { grid-template-columns:1fr; gap:12px; margin-top:15px; }
 .wa-info-panel { padding:18px; }
 .wa-workflow { align-items:stretch; flex-direction:column; gap:8px; }
 .wa-workflow-step { grid-template-columns:28px 1fr; align-items:center; gap:4px 8px; }
 .wa-workflow-step span { grid-row:1 / span 2; }
 .wa-workflow-step small { grid-column:2; }
 .wa-workflow-arrow { align-self:center; transform:rotate(90deg); line-height:1; }
 .wa-footer { flex-direction:column; gap:5px; padding-top:18px; }
}

/* ==========================================================
   WIBLIV PREMIUM UI PATCH  SOFT CORAL / WHITE
   Presentation only; preserve existing backend and workflows
   ========================================================== */

:root {
    --wa-red: #e94359;
    --wa-red-dark: #cf3048;
    --wa-red-soft: #fff0f2;
    --wa-coral: #f47788;
    --wa-page: #f4f6fb;
    --wa-card: #ffffff;
    --wa-ink: #15233b;
    --wa-muted: #71809a;
    --wa-border: #e3e9f3;
    --wa-shadow: 0 8px 26px rgba(28, 43, 72, .055);
    --wa-radius: 16px;
}

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    font-family: "Segoe UI", Arial, Helvetica, sans-serif !important;
    color: var(--wa-ink);
    background: var(--wa-page);
    line-height: 1.55;
    font-synthesis: none;
}

button, input, select, textarea {
    font: inherit;
}

button, .btn, a.btn, input[type="submit"], input[type="button"] {
    transition: background-color .18s ease, border-color .18s ease,
                box-shadow .18s ease, transform .18s ease;
}

button:focus-visible, a:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible {
    outline: 3px solid rgba(233, 67, 89, .22);
    outline-offset: 2px;
}

a {
    text-underline-offset: 3px;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
select, textarea {
    max-width: 100%;
    border: 1px solid #dce4ef;
    border-radius: 10px;
    background: #fff;
    color: var(--wa-ink);
    padding: 10px 12px;
    min-height: 42px;
    box-sizing: border-box;
}

textarea {
    min-height: 100px;
    resize: vertical;
}

button, .btn, input[type="submit"], input[type="button"] {
    border-radius: 10px;
}

table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

th {
    background: #f7f8fc;
    color: #63718a;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: .045em;
    text-transform: uppercase;
}

th, td {
    padding: 13px 15px;
    border-bottom: 1px solid #e9edf5;
    text-align: left;
    vertical-align: middle;
}

tbody tr:hover {
    background: #fff8f9;
}

.wa-topbar {
    background: #fff;
    border: 1px solid var(--wa-border);
    box-shadow: 0 3px 14px rgba(30, 43, 67, .035);
}

.wa-main {
    color: var(--wa-ink);
}

.wa-welcome {
    background: linear-gradient(115deg, #f58b99 0%, #ed6378 58%, #e94b63 100%) !important;
    border: 1px solid rgba(255,255,255,.55);
    box-shadow: 0 15px 36px rgba(221, 75, 98, .14);
}

.wa-module-card, .wa-bottom-grid > *, .wa-workflow-step {
    background: #fff;
    border: 1px solid var(--wa-border);
    border-radius: var(--wa-radius);
    box-shadow: var(--wa-shadow);
    transition: transform .18s ease, box-shadow .18s ease,
                border-color .18s ease;
}

.wa-module-card:hover {
    transform: translateY(-3px);
    border-color: #f3a3ae;
    box-shadow: 0 14px 30px rgba(28, 43, 72, .09);
}

.wa-module-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    font-size: 0 !important;
    line-height: 1;
    border-radius: 12px;
}

.wa-icon-red::before {
    content: "01";
    font-size: 12px;
    font-weight: 800;
    color: #df3c54;
}
.wa-icon-blue::before {
    content: "02";
    font-size: 12px;
    font-weight: 800;
    color: #3674cf;
}
.wa-icon-violet::before {
    content: "03";
    font-size: 12px;
    font-weight: 800;
    color: #8054d9;
}
.wa-icon-green::before {
    content: "04";
    font-size: 12px;
    font-weight: 800;
    color: #16845c;
}
.wa-icon-amber::before {
    content: "05";
    font-size: 12px;
    font-weight: 800;
    color: #b66a13;
}

.wa-module-action b {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0 !important;
    width: 23px;
    height: 23px;
    border-radius: 8px;
    background: var(--wa-red-soft);
}
.wa-module-action b::after {
    content: ">";
    font-size: 14px;
    color: var(--wa-red-dark);
}
.wa-primary-link span {
    font-size: 0 !important;
}
.wa-primary-link span::after {
    content: ">";
    font-size: 14px;
}

.wa-workflow-arrow {
    font-size: 0 !important;
}
.wa-workflow-arrow::after {
    content: ">";
    font-size: 15px;
    color: #d64b60;
}

.wa-hint {
    color: var(--wa-muted);
    line-height: 1.65;
}

button, .btn, input[type="submit"] {
    overflow-wrap: anywhere;
}

@media (max-width: 900px) {
    .wa-module-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 600px) {
    .wa-module-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .wa-welcome {
        padding: 24px !important;
        border-radius: 18px !important;
    }

    .wa-welcome h1 {
        font-size: clamp(23px, 6vw, 32px) !important;
        line-height: 1.2;
    }

    .wa-module-card {
        min-height: 190px;
    }

    table {
        font-size: 13px;
    }

    th, td {
        padding: 10px;
    }
}

/* Consistent polish for employee, hierarchy, visits and attendance pages */
main, .container, .content, .page-content {
    min-width: 0;
}

.card, .panel, .stat-card, .summary-card, .employee-card,
.table-container, .form-card, .filter-card {
    border-color: var(--wa-border);
    border-radius: var(--wa-radius);
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}
