/* Cookep navigation stays separate from the layout of operational pages. */
body.has-qk-nav {
    --qk-ink: #393747;
    --qk-muted: #85818e;
    --qk-brand: #7373c6;
    --qk-brand-light: #f0f0ff;
    --qk-surface: #fff;
    --qk-sidebar-width: 288px;
}
body.has-qk-nav .wrapper { margin-left: 0; padding-top: 86px; }
body.has-qk-nav .footer { left: 0 !important; }
body.has-qk-nav .alerta-facturas-proveedor { top: 64px; left: 0; }
body.has-qk-nav .alerta-facturas-proveedor + .modal + script + .wrapper,
body.has-qk-nav .alerta-facturas-proveedor + .modal + .wrapper { padding-top: 140px; }
.qk-svg-icon { display: block; flex: 0 0 auto; }

#topnav.qk-topbar {
    height: 64px; min-height: 64px; display: flex; align-items: center;
    gap: 16px; padding: 0 24px; background: #38383d;
    box-shadow: 0 2px 8px rgba(27, 25, 36, .08);
}
.qk-brand { display: inline-flex; align-items: center; flex: 0 0 auto; }
.qk-brand img { display: block; width: auto; height: 36px; }
.qk-brand .qk-logo-small { display: none; }
.qk-icon-button {
    border: 1px solid transparent; background: transparent; color: #eae9f0;
    display: inline-flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; padding: 0; border-radius: 9px; cursor: pointer;
    transition: background .15s, border-color .15s, color .15s;
}
.qk-icon-button:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.qk-icon-button:focus-visible, .qk-system-status:focus-visible, .qk-profile-button:focus-visible {
    outline: 2px solid #b6b6fe; outline-offset: 3px;
}
.qk-nav-toggle { flex: 0 0 auto; width: 38px; padding: 0; background: rgba(255, 255, 255, .045); border-color: rgba(255, 255, 255, .12); font: 500 13px Poppins, sans-serif; }
.qk-nav-toggle[aria-expanded='true'] { background: rgba(182, 182, 254, .14); border-color: rgba(182, 182, 254, .45); color: #d2d2ff; }
.qk-nav-toggle .qk-svg-icon { width: 18px; height: 18px; }
.qk-topbar-actions { margin-left: auto; display: flex; align-items: center; gap: 16px; flex: 0 0 auto; }
.qk-system-status { display: inline-flex; align-items: center; gap: 8px; border: 1px solid; border-radius: 7px; padding: 8px 11px; font: 500 12px/1.25 Poppins, sans-serif; cursor: pointer; white-space: nowrap; }
.qk-system-status .qk-svg-icon { width: 16px; height: 16px; }
.qk-system-ok { background: #3b5149; border-color: #4a6f5f; color: #b5e9cf; }
.qk-system-warning { background: #5b4d35; border-color: #8e7444; color: #f4d59b; }
.qk-system-status:hover { filter: brightness(1.12); }
.qk-profile-button { display: inline-flex; align-items: center; gap: 10px; border: 0; border-left: 1px solid rgba(255, 255, 255, .14); background: transparent; padding: 0 0 0 20px; color: #eeedf4; cursor: pointer; }
.qk-profile-button:after { display: none; }
.qk-profile-button img { border-radius: 50%; width: 34px; height: 34px; object-fit: cover; background: #fff; }
.qk-profile-button > .qk-svg-icon { width: 13px; height: 13px; margin-left: 6px; transform: rotate(90deg); color: #afacbb; }
.qk-account-label { display: block; text-align: left; max-width: 150px; }
.qk-account-label strong { display: block; font-size: 12px; font-weight: 500; line-height: 1.5; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.qk-account-label small { display: block; font-size: 10px; color: #aaa7b5; line-height: 1.4; }
.qk-topbar .profile-dropdown { border: 1px solid #e9e7ee; border-radius: 10px; padding: 6px; margin-top: 13px; box-shadow: 0 12px 36px rgba(30, 26, 46, .13); }
.qk-topbar .profile-dropdown .dropdown-item { border-radius: 6px; padding: 10px 12px; font-size: 13px; }

.qk-activity-wrap { position: relative; }
.qk-activity-toggle { position: relative; }
.qk-activity-toggle[aria-expanded='true'] { background: rgba(182, 182, 254, .14); color: #d2d2ff; }
.qk-activity-badge { position: absolute; right: -8px; top: -6px; border: 2px solid #38383d; border-radius: 20px; padding: 0 4px; min-width: 18px; color: #fff; background: #d56873; font: 600 9px/12px Poppins, sans-serif; }
.qk-activity-panel { position: absolute; top: 50px; right: -8px; width: min(374px, calc(100vw - 24px)); max-height: calc(100dvh - 88px); overflow: auto; background: #fff; border: 1px solid #e8e6ee; border-radius: 12px; box-shadow: 0 14px 44px rgba(35, 30, 50, .16); z-index: 1041; color: var(--qk-ink); }
.qk-activity-panel[hidden], .qk-sidebar-backdrop[hidden], .qk-activity-item b[hidden] { display: none !important; }
.qk-activity-heading { display: flex; align-items: center; justify-content: space-between; padding: 17px 18px; border-bottom: 1px solid #eeedf3; }
.qk-activity-heading strong { display: block; font-size: 16px; font-weight: 600; }
.qk-activity-heading small { display: block; margin-top: 3px; font-size: 11px; color: var(--qk-muted); }
.qk-activity-heading .qk-icon-button, .qk-sidebar-close { color: #777280; width: 32px; height: 32px; }
.qk-activity-heading .qk-icon-button:hover, .qk-sidebar-close:hover { color: var(--qk-brand); background: var(--qk-brand-light); }
.qk-activity-heading .qk-icon-button:focus-visible, .qk-sidebar-close:focus-visible { outline: 2px solid var(--qk-brand); outline-offset: 2px; }
.qk-activity-list { padding: 5px 0 10px; }
.qk-activity-section-label { padding: 12px 18px 7px; color: var(--qk-muted); font-size: 10px; font-weight: 500; text-transform: uppercase; letter-spacing: .07em; }
.qk-activity-item { width: calc(100% - 20px); display: flex; align-items: center; gap: 12px; margin: 2px 10px; padding: 12px 10px; border: 0; border-radius: 8px; background: #fff; color: var(--qk-ink); text-align: left; cursor: pointer; }
.qk-activity-item:hover, .qk-activity-item:focus-visible { background: #f6f5fb; color: var(--qk-ink); text-decoration: none; }
.qk-activity-item:focus-visible { outline: 2px solid var(--qk-brand); outline-offset: -2px; }
.qk-activity-item:disabled { cursor: default; opacity: 1; }
.qk-activity-item:disabled:hover { background: #fff; }
.qk-activity-item > .qk-svg-icon { width: 20px; height: 20px; color: var(--qk-brand); }
.qk-activity-item:disabled > .qk-svg-icon { color: #a6a2b2; }
.qk-activity-item > span { flex: 1; min-width: 0; }
.qk-activity-item strong { display: block; font-size: 12px; font-weight: 500; }
.qk-activity-item small { display: block; margin-top: 3px; color: var(--qk-muted); font-size: 11px; line-height: 1.45; white-space: normal; }
.qk-activity-item b { padding: 3px 8px; border-radius: 6px; background: var(--qk-brand-light); color: var(--qk-brand); font-size: 11px; font-weight: 600; }
.qk-activity-complete, .qk-activity-complete:hover { cursor: default; background: #eff8f3; color: #317451; }
.qk-activity-complete > .qk-svg-icon { color: #48a575; }
.qk-activity-complete small { color: #68927a; }

.qk-sidebar { position: fixed; top: 64px; bottom: 0; left: 0; width: min(var(--qk-sidebar-width), calc(100% - 24px)); z-index: 1040; display: flex; flex-direction: column; background: #fff; border-right: 1px solid #e8e6ee; visibility: hidden; pointer-events: none; transform: translateX(-100%); transition: transform .2s ease; color: var(--qk-ink); }
.qk-sidebar.is-open { transform: translateX(0); visibility: visible; pointer-events: auto; }
.qk-sidebar-backdrop { position: fixed; inset: 64px 0 0; z-index: 1035; background: rgba(30, 27, 39, .22); }
.qk-sidebar-header { display: flex; align-items: center; justify-content: space-between; padding: 23px 22px 20px; border-bottom: 1px solid #eeedf3; }
.qk-sidebar-eyebrow { display: block; color: var(--qk-muted); font-size: 9px; font-weight: 500; letter-spacing: .09em; }
.qk-sidebar-header strong { display: block; margin-top: 4px; color: var(--qk-ink); font-size: 18px; font-weight: 600; }
.qk-sidebar-nav { overflow-y: auto; overscroll-behavior: contain; min-height: 0; flex: 1; padding: 14px 12px; scrollbar-width: thin; scrollbar-color: #ddd9e8 transparent; }
.qk-nav-link, .qk-nav-group > summary { display: flex; align-items: center; gap: 13px; padding: 13px 12px; margin: 2px 0; border-radius: 8px; color: #64606e; font-size: 14px; font-weight: 500; line-height: 1.3; cursor: pointer; list-style: none; }
.qk-nav-group > summary::-webkit-details-marker { display: none; }
.qk-nav-link:hover, .qk-nav-group > summary:hover { background: #f7f6fa; color: var(--qk-ink); text-decoration: none; }
.qk-nav-link.active, .qk-nav-group.active > summary { background: var(--qk-brand-light); color: #6262ae; }
.qk-nav-link:focus-visible, .qk-nav-group > summary:focus-visible, .qk-nav-children a:focus-visible, .qk-sidebar-settings:focus-visible { outline: 2px solid var(--qk-brand); outline-offset: -2px; }
.qk-nav-link > .qk-svg-icon, .qk-nav-group > summary > .qk-svg-icon { width: 20px; height: 20px; }
.qk-nav-chevron { display: flex; margin-left: auto; color: #aaa5b3; }
.qk-nav-chevron .qk-svg-icon { width: 14px; height: 14px; transition: transform .15s; }
.qk-nav-group[open] .qk-nav-chevron .qk-svg-icon { transform: rotate(90deg); }
.qk-nav-children { margin: 6px 8px 12px 22px; border-left: 1px solid #e7e4ef; padding: 0 0 0 15px; }
.qk-nav-children a { position: relative; display: block; padding: 10px 11px; margin: 2px 0; border-radius: 6px; color: #827c8c; font-size: 13px; line-height: 1.5; }
.qk-nav-children a:hover { background: #f7f6fa; color: var(--qk-ink); text-decoration: none; }
.qk-nav-children a.active { background: var(--qk-brand-light); color: #6262ae; font-weight: 500; text-decoration: none; }
.qk-nav-children a.active:before { content: ''; position: absolute; top: calc(50% - 3px); left: -19px; width: 7px; height: 7px; border-radius: 50%; background: #9292db; box-shadow: 0 0 0 3px #fff; }
.qk-sidebar-settings { display: flex; align-items: center; gap: 12px; margin: 10px 14px 14px; padding: 13px 12px; border: 1px solid #eeeaf5; border-radius: 9px; background: #f8f7fc; color: #666079; font-size: 12px; }
.qk-sidebar-settings:hover { background: var(--qk-brand-light); color: var(--qk-brand); text-decoration: none; }
.qk-sidebar-settings span { flex: 1; }
.qk-sidebar-settings small { display: block; margin-top: 3px; color: #9690a3; font-size: 10px; }
.qk-sidebar-settings > .qk-svg-icon:last-child { width: 14px; height: 14px; }

.qk-menu-settings { margin-top: 20px; scroll-margin-top: 86px; }
.qk-menu-settings-header { margin-bottom: 18px; }
.qk-menu-settings-header h2 { margin: 4px 0 6px; font-size: 22px; }
.qk-menu-settings-header p { margin: 0; color: #66788b; }
.qk-menu-settings-group { border: 1px solid #e2e9ef; border-radius: 12px; margin-bottom: 10px; background: #fff; overflow: hidden; }
.qk-menu-settings-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 16px; }
.qk-menu-settings-row + .qk-menu-settings-row, .qk-menu-settings-children { border-top: 1px solid #eef1f4; }
.qk-menu-settings-children .qk-menu-settings-row { padding-left: 32px; }
.qk-menu-settings-name { color: #2d4359; font-weight: 600; }
.qk-menu-switch { position: relative; display: inline-flex; flex: 0 0 auto; align-items: center; width: 42px; height: 24px; }
.qk-menu-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.qk-menu-switch span { display: block; width: 42px; height: 24px; border-radius: 20px; background: #aab7c4; transition: background .15s; pointer-events: none; }
.qk-menu-switch span:after { content: ''; position: absolute; width: 18px; height: 18px; top: 3px; left: 3px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px #6c7b89; transition: transform .15s; }
.qk-menu-switch input:checked + span { background: #7373c6; }
.qk-menu-switch input:checked + span:after { transform: translateX(18px); }
.qk-menu-switch input:focus-visible + span { outline: 3px solid #73b6de; outline-offset: 2px; }
.qk-menu-settings-status { min-height: 20px; color: #376b42; font-size: 12px; }


@media (max-width: 1279px) {
    #topnav.qk-topbar { padding: 0 20px; gap: 14px; }
}
@media (min-width: 768px) {
    body.has-qk-nav.qk-nav-expanded .wrapper { margin-left: var(--qk-sidebar-width); }
    body.has-qk-nav.qk-nav-expanded .footer { left: var(--qk-sidebar-width) !important; }
    body.has-qk-nav.qk-nav-expanded .alerta-facturas-proveedor { left: var(--qk-sidebar-width); }
    .qk-sidebar-backdrop { display: none; }
}
@media (min-width: 768px) and (max-width: 1023px) {
    body.has-qk-nav { --qk-sidebar-width: 256px; }
}
@media (max-width: 767px) {
    body.has-qk-nav.qk-nav-mobile-open { overflow: hidden; }
    .qk-sidebar { box-shadow: 6px 0 28px rgba(34, 29, 48, .14); }
}
@media (max-width: 800px) {
    .qk-account-label { display: none; }
    .qk-profile-button { padding-left: 12px; }
    .qk-profile-button > .qk-svg-icon { display: none; }
    .qk-topbar-actions { gap: 10px; }
}
@media (max-width: 620px) {
    #topnav.qk-topbar { padding: 0 12px; gap: 10px; }
    .qk-brand .qk-logo-large { display: none; }
    .qk-brand .qk-logo-small { display: block; width: 32px; height: 32px; }
    .qk-nav-toggle { width: 36px; padding: 0; }
    .qk-system-status { padding: 7px 9px; font-size: 10px; gap: 6px; }
    .qk-system-status span { max-width: 112px; white-space: normal; text-align: left; }
    .qk-profile-button { border-left: 0; padding: 0; }
    .qk-activity-panel { position: fixed; top: 72px; left: 12px; right: 12px; width: auto; max-width: 374px; margin-left: auto; }
    .qk-menu-settings-children .qk-menu-settings-row { padding-left: 22px; }
}
@media (max-width: 360px) {
    #topnav.qk-topbar { padding: 0 10px; gap: 8px; }
    .qk-topbar-actions { gap: 5px; }
    .qk-system-status { padding: 7px; }
    .qk-system-status .qk-svg-icon { width: 14px; height: 14px; }
    .qk-system-status span { max-width: 80px; }
}
@media (prefers-reduced-motion: reduce) {
    .qk-sidebar, .qk-icon-button, .qk-nav-chevron .qk-svg-icon { transition: none; }
}
@media print {
    #topnav.qk-topbar, .qk-sidebar, .qk-sidebar-backdrop { display: none !important; }
    body.has-qk-nav.qk-nav-expanded .wrapper, body.has-qk-nav .wrapper { padding-top: 0; margin-left: 0; }
}