/* accessibility css */
 *:focus,
 .sign_in_btn:focus {
     outline: 2px solid #fff !important;
     outline-offset: 2px !important;
     box-shadow: 0 0 0 4px #005fcc !important;
     border-radius: 4px !important;
 }

 body {
     overflow-x: hidden;
 }

 .cookie-block a {
     color: var(--brand);
 }

 /* Visually hidden content available to screen readers (sr-only / .visually-hidden) */
 .sr-only,
 .visually-hidden {
     position: absolute !important;
     width: 1px !important;
     height: 1px !important;
     padding: 0 !important;
     margin: -1px !important;
     overflow: hidden !important;
     clip: rect(0, 0, 0, 0) !important;
     white-space: nowrap !important;
     border: 0 !important;
 }

 .owl-dot.active {
     transform: scale(1.5) !important;
 }


 header:not(.site-main-header header) {
     /* top: 14px !important; */
     top: 28px !important;
 }

 .site-main-header {
     top: 28px !important;
 }

 /* Force menu visibility when active via keyboard or JS */
 .dropdown-visible {
     opacity: 1 !important;
     visibility: visible !important;
     display: block !important;
 }

 /* Accessibility Focus Ring */
 .nav-link:focus,
 .dropdown-outer a:focus {
     outline: 2px solid #0056b3 !important;
     outline-offset: 2px;
 }

 /* Container for the top accessibility tools */
 .a11y-toolbar {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     z-index: 999999;
     display: flex;
     justify-content: space-between;
     align-items: center;
     background: #333;
     color: white;
 }

 /* Skip link: Hidden visually but appears on Tab */
 .skip-main {
     /* position: absolute; */
     right: 0;
     top: 0;
     color: white;
     padding: 6px 5px;
     text-decoration: none;
 }

 .skip-main:focus {
     position: static;
     width: auto;
     height: auto;
 }

 /* Animation Buttons Styles */
 .motion-controls {
     display: flex;
     gap: 5px;
     padding: 5px 15px;
     margin-right: auto;
     /* Pushes icons to the right */
 }

 .dropdown-outer.is-active {
     opacity: 1 !important;
     visibility: visible !important;
     pointer-events: auto !important;
 }

 /* This overrides everything, including your hover styles */
 .dropdown-force-hide {
     opacity: 0 !important;
     visibility: hidden !important;
     pointer-events: none !important;
 }

 .motion-controls button {
     background: #444;
     border: 1px solid #666;
     color: white;
     padding: 0px 12px;
     cursor: pointer;
     border-radius: 4px;
     font-size: 12px;
     transition: 0.2s;
 }

 .motion-controls button:hover,
 .motion-controls button:focus {
     background: #555;
     outline: 2px solid #fff;
 }

 .motion-controls button.active {
     background: #2057a6;
     border-color: #fff;
 }

 .nav_brand>a {
     display: block;
 }

 /* acccessibility css end */

 :root {
     --brand: #004b87;
     --accent: #008575;
     --danger: #b22222;
 }

 .cookie-block {
     display: grid;




     /* BANNER */
     #cookie-banner {
         position: fixed;
         left: 12px;
         right: 12px;
         bottom: 12px;
         background: #fff;
         border: 1px solid rgba(0, 0, 0, 0.08);
         box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
         padding: 18px;
         z-index: 2147483647;
         border-radius: 8px;
         /* display: grid;*/
         grid-template-columns: 1fr auto;
         gap: 12px;
         align-items: center;
         min-width: 320px;
     }

     #cookie-banner h3 {
         margin: 0 0 6px 0;
         color: var(--brand);
         font-size: 16px;
     }

     #cookie-banner p {
         margin: 0;
         font-size: 14px;
         color: #111;
         line-height: 1.4;
     }

     .cookie-controls {
         display: flex;
         gap: 8px;
         flex-wrap: wrap;
         align-items: center;
         justify-content: flex-end;
     }

     .btn {
         padding: 10px 14px;
         border-radius: 6px;
         font-weight: 600;
         cursor: pointer;
         border: 0;
         font-size: 13px;
     }

     .btn-primary {
         background: var(--accent);
         color: #fff;
     }

     .btn-danger {
         background: var(--danger);
         color: #fff;
     }

     .btn-neutral {
         background: #f3f3f3;
         color: #111;
         border: 1px solid #e8e8e8;
     }

     /* PREFERENCES PANEL */
     #pref-panel {
         grid-column: 1 / -1;
         background: #fbfbfb;
         border-radius: 6px;
         padding: 12px;
         border: 1px solid #eee;
         display: none;
     }

     /* ACCORDION */
     .acc-item {
         border-bottom: 1px solid #ddd;
         padding: 10px 0;
     }

     .acc-header {
         display: flex;
         justify-content: space-between;
         cursor: pointer;
         align-items: center;
     }

     .acc-header span.title {
         font-size: 15px;
         font-weight: bold;
         color: #222;
     }

     .acc-header .arrow {
         font-size: 18px;
         transition: transform 0.2s;
         color: #333;
         margin: 4px 10px;
     }

     .button-section div:first-child {
         width: 60%;
     }

     .acc-item.active .arrow {
         transform: rotate(180deg);
     }

     .acc-body {
         display: none;
         padding: 8px 4px 4px;
         font-size: 13px;
         color: #444;
         line-height: 1.5;
     }

     .acc-item.active .acc-body {
         display: block;
     }

     /* TOGGLE SWITCH */
     .toggle {
         position: relative;
         display: inline-block;
         width: 42px;
         height: 22px;
     }

     .toggle input {
         opacity: 0;
         width: 0;
         height: 0;
     }

     .slider {
         position: absolute;
         cursor: pointer;
         top: 0;
         left: 0;
         right: 0;
         bottom: 0;
         background: #ccc;
         transition: 0.3s;
         border-radius: 22px;
     }

     .slider:before {
         position: absolute;
         content: "";
         height: 16px;
         width: 16px;
         left: 3px;
         bottom: 3px;
         background: #fff;
         transition: 0.3s;
         border-radius: 50%;
     }

     input:checked+.slider {
         background: var(--accent);
     }

     input:checked+.slider:before {
         transform: translateX(20px);
     }

     footer {
         position: fixed;
         bottom: 0;
         width: 100%;
         text-align: center;
         padding: 10px 0;
         background: #f9f9f9;
         border-top: 1px solid #eee;
         font-size: 13px;
     }

     footer a {
         text-decoration: underline;
         color: var(--brand);
     }

     .button-section {
         display: flex;
         gap: 8px;
         justify-content: space-between;
         margin-top: 8px;
         flex-direction: row;
     }

     .acc-header div {
         display: flex;
     }
 }

 @media (max-width: 640px) {
     #cookie-banner {
         grid-template-columns: 1fr;
         padding: 14px;
     }

     .button-section {
         flex-direction: column;
     }

     .button-section div:first-child {
         width: auto;
     }

     .cookie-controls {
         justify-content: start;
     }

     .cookie-block {
         .button-section div:first-child {
             width: 100%;
             margin-bottom: 14px;
         }

         .button-section {
             display: block;
         }

         #cookie-banner {
             overflow: scroll;
             height: 40%;
             display: block;
         }

         .cookie-controls {
             justify-content: flex-start;
             margin-top: 14px;
         }
     }
 }