/**
 * Inspecta Topbar – Final slim + right tight + banner-safe
 * Version: 1.7.2-banner-safe
 */

:root {
    --topbar-height: 20px;
    --topbar-padding: var(--mobile-padding);
    --topbar-bg: linear-gradient(90deg, #123F6D 0%, #0060A1 50%, #2483C5 100%);
    --topbar-border: var(--wp--preset--color--neutral-200, #e5e7eb);
    --topbar-text: #ffffff;
    --topbar-accent: var(--wp--preset--color--inspecta-blue, #123f6d);
    --topbar-hover: #f3f4f6;
    --topbar-mono: "Necto Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

@media (min-width: 1024px) {
    :root {
        --topbar-height: 30px;
    }
}

/* Core topbar */
.lgjgl-topbar {
    position: fixed !important;
    inset-block-start: var(--wp-admin--admin-bar--height, 0) !important;
    inset-inline: 0;
    z-index: 10001 !important;                      /* above banner */
    height: var(--topbar-height) !important;
    background: var(--topbar-bg);
    border-block-end: 1px solid var(--topbar-border);
    display: flex !important;
    align-items: center !important;
    padding-inline: var(--topbar-padding);
    font-size: 13.5px;
    color: var(--topbar-text);
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

body.admin-bar .lgjgl-topbar {
    inset-block-start: var(--wp-admin--admin-bar--height, 32px) !important;
}

@media (min-width: 783px) {
    body.admin-bar .lgjgl-topbar {
        inset-block-start: var(--wp-admin--admin-bar--height, 46px) !important;
    }
}

[dir="rtl"] .lgjgl-topbar {
    direction: rtl;
}

/* Inner layout */
.lgjgl-topbar > .wp-block-group {
    width: 100% !important;
    max-width: var(--wp--style--global--wide-size);
    margin: 0 auto !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px;
    height: 100% !important;
}

/* Left-center */
.lgjgl-topbar .topbar-left-center,
.lgjgl-language-switcher + .wp-block-group {        /* fallback if no custom class */
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 16px;
    flex-shrink: 1;
}

.topbar-global-contacts {
    flex: 1 1 auto;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0 !important;
    font-weight: 500;
    color: #fafafa;
    font-size: 0.81rem;
    max-width: 45%;                                 /* prevent overflow */
}

/* Right side */
.right-controls {
    position: relative;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 2px !important;
    flex-shrink: 0;
    margin-inline-start: auto !important;
}

.region-selector-button {
    display: flex !important;
    align-items: center !important;
    gap: 0.375rem;
    padding: 4px 10px 4px 12px !important;
    border-radius: 5px;
    font-family: var(--topbar-mono);
    text-transform: uppercase;
    font-size: 0.81rem;
    white-space: nowrap;
    background: transparent;
    border: none;
    cursor: pointer;
}

.region-selector-button svg {
    width: 18px !important;
    height: 18px !important;
}

.topbar-accessibility-button {
    padding: 4px 6px !important;
    border-radius: 50%;
    background: transparent;
    border: none;
    cursor: pointer;
    margin: 0 !important;
}

.topbar-accessibility-button svg {
    width: 18px !important;
    height: 18px !important;
}

/* Dropdown */
/* Dropdown – FIXED */
.region-selector-dropdown {
    position: absolute;
    top: calc(100% + 6px);
    inset-inline-end: 0; /* aligns right in LTR, left in RTL */
    min-width: 210px;

    background: var(--topbar-bg);
    border: 1px solid var(--topbar-border);
    border-radius: 6px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.12);

    padding: 10px 12px;
    z-index: 10005;

    display: none;
}

.region-selector-dropdown:not([hidden]) {
    display: block;
}

/* Mobile */
@media (max-width: 639px) {
    :root {
        --topbar-height: 42px;
    }
    .lgjgl-topbar {
        font-size: 13px;
    }
    .topbar-global-contacts {
        display: none !important;
    }
    .right-controls {
        gap: 0 !important;
    }
    .region-selector-button {
        padding: 4px 8px 4px 10px !important;
        font-size: 0.79rem;
    }
    .topbar-accessibility-button {
        padding: 4px 5px !important;
    }
}

/* Wide screens */
@media (min-width: 1024px) {
    .lgjgl-topbar {
        padding-inline: calc(100vw - 100%) !important;
    }
}

@media (min-width: 1280px) {
    .lgjgl-topbar {
        padding-inline: 0 !important;
    }
}

/* Focus */
.region-selector-button:focus-visible,
.topbar-accessibility-button:focus-visible,
.language-link:focus-visible {
    outline: 1px solid var(--topbar-accent);
    outline-offset: 2px;
}


.globe-icon,
.chevron-icon {
    display: inline-block !important;
    stroke: currentColor !important;
    stroke-width: 1.6 !important;
    fill: none !important;
    flex-shrink: 0;
    min-width: 18px;
    min-height: 18px;
}
.region-selector-button {
    color: #ffffff !important;     /* or your accent color */
}


.region-selector-dropdown[aria-expanded="true"] ~ .region-selector-dropdown,
.region-selector-dropdown:not([hidden]) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: translateY(0) !important;
}



.region-selector-button svg {
  flex-shrink: 0;
  display: inline-block;
}









.topbar-ticker {
    margin: 0px;
	overflow: hidden;
	  color: rgb(255, 255, 255);
  font-family: "Inter", sans-serif;
  font-size: 14px;
  letter-spacing: 0px;
  line-height: 20px;
  font-weight: 500;

}

.topbar-ticker__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.topbar-ticker__list li {
	display: none;
	white-space: nowrap;
}

.topbar-ticker__list li a {
    color: inherit;
    text-decoration: none;
}
.topbar-ticker__list li a:hover {
    text-decoration: underline;
    color: var(--topbar-hover); 
}


.topbar-ticker__list li.is-active {
	display: inline-block;
	animation: slideIn 0.4s ease;
}

@keyframes slideIn {
	from { opacity: 0; transform: translateY(6px); }
	to { opacity: 1; transform: translateY(0); }
}