/*
 * PalTenders brand system
 * Loaded after page styles so the approved identity remains consistent
 * without changing semantic status colors or the compact listing layout.
 */

:root {
    --brand-navy: #2A3C92;
    --brand-navy-dark: #1D2D70;
    --brand-cyan: #00AEEF;
    --brand-cyan-dark: #007FAE;
    --brand-cyan-soft: #E8F8FE;
    --brand-ink: #10233F;
    --brand-muted: #627089;
    --brand-surface: #F4F7FB;
    --brand-border: #DCE4EE;
    --brand-yellow: #FFC928;
    --brand-orange: #FF8A22;
    --brand-red: #F22B2B;
    --brand-focus: 0 0 0 3px rgba(0, 174, 239, .28);
    --brand-shadow: 0 12px 32px rgba(16, 35, 63, .08);
}

html[dir="rtl"] body {
    font-family: "Cairo", sans-serif !important;
}

html[dir="ltr"] body {
    font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body {
    color: var(--brand-ink) !important;
    background: var(--brand-surface) !important;
}

a {
    color: var(--brand-navy);
}

a:hover {
    color: var(--brand-cyan-dark);
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid var(--brand-cyan) !important;
    outline-offset: 3px !important;
    box-shadow: var(--brand-focus);
}

::selection {
    color: #fff;
    background: var(--brand-navy);
}

/* Header and navigation */
header {
    background: #fff !important;
    color: var(--brand-ink) !important;
    border-top-color: var(--brand-navy) !important;
    border-bottom-color: var(--brand-border) !important;
    box-shadow: 0 3px 16px rgba(16, 35, 63, .07) !important;
}

.header-container {
    max-width: 1600px;
    margin-inline: auto !important;
}

.logo-section {
    gap: 10px !important;
}

.logo-link,
.logo-container,
.logo-container picture {
    display: flex;
    align-items: center;
}

.logo-link {
    border-radius: 10px;
}

.logo-container picture,
.logo-container img {
    width: 100%;
    height: 100%;
}

.logo-container img {
    object-fit: contain;
    border-radius: 0;
}

.brand-subtitle {
    margin: 0;
    color: var(--brand-muted) !important;
    font-size: .72rem !important;
    font-weight: 650;
    line-height: 1.4;
    white-space: nowrap;
}

.header-nav {
    align-self: stretch;
    align-items: center;
    gap: 2px !important;
}

.header-nav .nav-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    align-self: stretch;
    padding: 0 10px !important;
    color: #35465F !important;
    border-radius: 0 !important;
    font-size: .88rem;
    font-weight: 650;
    text-decoration: none !important;
}

.header-nav .nav-link::after {
    position: absolute;
    right: 10px;
    bottom: 4px;
    left: 10px;
    height: 3px;
    content: "";
    background: var(--brand-cyan);
    border-radius: 999px;
    opacity: 0;
    transform: scaleX(.4);
}

.header-nav .nav-link:hover {
    color: var(--brand-navy) !important;
    background: var(--brand-cyan-soft) !important;
}

.header-nav .nav-link.is-active {
    color: var(--brand-navy) !important;
    font-weight: 800;
}

.header-nav .nav-link.is-active::after {
    opacity: 1;
    transform: scaleX(1);
}

.btn-signin-small,
.mobile-btn-signin {
    color: #fff !important;
    background: var(--brand-navy) !important;
    border: 1px solid var(--brand-navy) !important;
    box-shadow: 0 5px 14px rgba(42, 60, 146, .18) !important;
    text-decoration: none !important;
}

.btn-signin-small:hover,
.mobile-btn-signin:hover {
    color: #fff !important;
    background: var(--brand-navy-dark) !important;
    border-color: var(--brand-navy-dark) !important;
}

.mobile-menu-toggle {
    color: var(--brand-navy) !important;
    background: var(--brand-cyan-soft) !important;
    border: 1px solid #BDEBFB !important;
    border-radius: 10px !important;
}

.mobile-menu {
    border-top: 1px solid var(--brand-border) !important;
    background: #fff !important;
}

.mobile-nav-link {
    color: #35465F !important;
}

.mobile-nav-link:hover,
.mobile-nav-link.is-active {
    color: var(--brand-navy) !important;
    background: var(--brand-cyan-soft) !important;
    border-color: #BDEBFB !important;
}

.mobile-nav-link.is-active {
    box-shadow: inset 3px 0 0 var(--brand-cyan);
    font-weight: 800;
}

html[dir="rtl"] .mobile-nav-link.is-active {
    box-shadow: inset -3px 0 0 var(--brand-cyan);
}

.user-menu-trigger:hover,
.user-menu-trigger[aria-expanded="true"] {
    color: var(--brand-navy) !important;
    border-color: var(--brand-cyan) !important;
    background: var(--brand-cyan-soft) !important;
}

.user-menu-dropdown,
.mobile-user-menu-dropdown {
    border-color: var(--brand-border) !important;
    box-shadow: var(--brand-shadow) !important;
}

.user-menu-item:not(.user-menu-item-danger):hover {
    color: var(--brand-navy) !important;
    background: var(--brand-cyan-soft) !important;
}

.global-search-trigger,
.global-search-close {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    color: var(--brand-navy);
    background: var(--brand-cyan-soft);
    border: 1px solid #bde2f2;
    border-radius: 10px;
    cursor: pointer;
}

.global-search-trigger:hover,
.global-search-trigger[aria-expanded="true"],
.global-search-close:hover {
    color: var(--brand-navy-dark);
    background: #d9f2fb;
    border-color: var(--brand-cyan);
}

.global-search-backdrop {
    position: fixed;
    z-index: 1200;
    inset: 0;
    background: rgba(12, 29, 53, .42);
    backdrop-filter: blur(2px);
}

.global-search-panel {
    position: fixed;
    z-index: 1210;
    top: 88px;
    right: 50%;
    width: min(760px, calc(100% - 32px));
    padding: 0;
    transform: translateX(50%);
}

.global-search-panel-inner {
    padding: 18px;
    background: #fff;
    border: 1px solid var(--brand-border);
    border-radius: 16px;
    box-shadow: 0 22px 70px rgba(16, 35, 63, .24);
}

.global-search-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.global-search-heading span {
    color: var(--brand-navy);
    font-size: .7rem;
    font-weight: 800;
}

.global-search-heading h2 {
    margin: 3px 0 0;
    color: var(--brand-ink);
    font-size: 1.18rem;
    font-weight: 850;
}

.global-search-close {
    width: 36px;
    height: 36px;
    color: #607089;
    background: #f5f8fb;
    border-color: #dfe7f0;
}

.global-search-scopes {
    display: flex;
    gap: 7px;
    margin-top: 14px;
    overflow-x: auto;
}

.global-search-scopes button {
    flex: 0 0 auto;
    min-height: 34px;
    padding: 7px 12px;
    color: #586880;
    background: #fff;
    border: 1px solid var(--brand-border);
    border-radius: 999px;
    font: inherit;
    font-size: .74rem;
    font-weight: 750;
    cursor: pointer;
}

.global-search-scopes button.is-active {
    color: var(--brand-navy);
    background: var(--brand-cyan-soft);
    border-color: #a8d9ec;
}

.global-search-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    margin-top: 12px;
}

.global-search-form label {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 46px;
    padding: 0 13px;
    color: #8290a3;
    background: #f9fbfd;
    border: 1px solid var(--brand-border);
    border-radius: 11px;
}

.global-search-form input {
    width: 100%;
    min-width: 0;
    padding: 0 !important;
    color: var(--brand-ink);
    background: transparent;
    border: 0 !important;
    outline: 0;
    box-shadow: none !important;
    font: inherit;
    font-size: .84rem;
}

.global-search-form > button {
    min-height: 46px;
    padding: 9px 18px;
    border-radius: 11px;
    font: inherit;
    font-size: .8rem;
    font-weight: 850;
    cursor: pointer;
}

body.global-search-open {
    overflow: hidden;
}

/* Common controls */
.btn-primary,
.primary-button,
.search-button,
.filter-button,
.submit-btn,
.op-btn-primary,
.pt-search-button,
.pt-primary-action,
button[type="submit"]:not(.user-menu-item-danger):not(.mobile-btn-signout) {
    color: #fff !important;
    background-color: var(--brand-navy) !important;
    border-color: var(--brand-navy) !important;
    background-image: none !important;
}

.btn-primary:hover,
.primary-button:hover,
.search-button:hover,
.filter-button:hover,
.submit-btn:hover,
.op-btn-primary:hover,
.pt-search-button:hover,
.pt-primary-action:hover,
button[type="submit"]:not(.user-menu-item-danger):not(.mobile-btn-signout):hover {
    color: #fff !important;
    background-color: var(--brand-navy-dark) !important;
    border-color: var(--brand-navy-dark) !important;
}

.btn-outline-primary,
.btn-secondary,
.secondary-button,
.op-btn:not(.op-btn-primary),
.pt-secondary-action {
    color: var(--brand-navy) !important;
    background: #fff !important;
    border-color: #BFCBE2 !important;
}

.btn-outline-primary:hover,
.btn-secondary:hover,
.secondary-button:hover,
.op-btn:not(.op-btn-primary):hover,
.pt-secondary-action:hover {
    color: var(--brand-navy) !important;
    background: var(--brand-cyan-soft) !important;
    border-color: var(--brand-cyan) !important;
}

input:not([type="checkbox"]):not([type="radio"]),
select,
textarea,
.form-control,
.form-select {
    color: var(--brand-ink) !important;
    border-color: var(--brand-border) !important;
}

input:not([type="checkbox"]):not([type="radio"]):focus,
select:focus,
textarea:focus,
.form-control:focus,
.form-select:focus {
    border-color: var(--brand-cyan) !important;
    box-shadow: var(--brand-focus) !important;
}

input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--brand-navy);
}

.pagination .active > .page-link,
.page-item.active .page-link,
.pagination .current {
    color: #fff !important;
    background: var(--brand-navy) !important;
    border-color: var(--brand-navy) !important;
}

.page-link:hover {
    color: var(--brand-navy) !important;
    background: var(--brand-cyan-soft) !important;
    border-color: var(--brand-cyan) !important;
}

/* Marketplace: preserve the compact, single-column content-first layout. */
.pt-marketplace {
    background:
        radial-gradient(circle at 8% 14%, rgba(0, 174, 239, .065), transparent 24rem),
        linear-gradient(180deg, #FBFDFF 0, var(--brand-surface) 100%) !important;
}

.pt-utility-ribbon {
    background: linear-gradient(90deg, rgba(232, 248, 254, .88), rgba(255, 255, 255, .98)) !important;
    border-bottom-color: var(--brand-border) !important;
}

.pt-ribbon-feature-icon,
.pt-search-icon,
.pt-stat-icon {
    color: var(--brand-navy) !important;
    border-color: #BDEBFB !important;
    background: #fff !important;
}

.pt-marketplace :where(.pt-title, .pt-listing-title, h1, h2, h3) {
    color: var(--brand-ink);
}

.pt-marketplace :where(.pt-tab.is-active, .pt-chip.is-active, .pt-quick-chip.is-active) {
    color: var(--brand-navy) !important;
    background: var(--brand-cyan-soft) !important;
    border-color: var(--brand-cyan) !important;
}

.pt-marketplace :where(.pt-tab, .pt-chip, .pt-quick-chip, .pt-save-search, .pt-link):hover {
    color: var(--brand-navy) !important;
    border-color: var(--brand-cyan) !important;
}

.pt-listing-card,
.job-card,
.tender-card,
.listing-card {
    background: #fff !important;
    border-color: var(--brand-border) !important;
}

.pt-listing-card:hover,
.job-card:hover,
.tender-card:hover,
.listing-card:hover {
    border-color: #B8DFF0 !important;
    box-shadow: 0 9px 24px rgba(16, 35, 63, .08) !important;
}

.pt-listing-card.is-featured,
.job-card.is-featured,
.tender-card.is-featured {
    border-inline-start: 4px solid var(--brand-yellow) !important;
}

.featured-badge,
.sponsored-badge,
.badge-featured,
.badge-sponsored {
    color: #5D4300 !important;
    background: #FFF4C2 !important;
    border-color: #F6D45C !important;
}

/* Opportunity, account, and application workspaces */
.op-hero {
    background: linear-gradient(135deg, #FBFDFF, var(--brand-cyan-soft)) !important;
    border-color: var(--brand-border) !important;
}

.op-eyebrow,
.op-nav a.is-active,
.op-tab.is-active {
    color: var(--brand-navy) !important;
}

.op-nav a:hover,
.op-tab:hover {
    color: var(--brand-navy) !important;
    border-color: var(--brand-cyan) !important;
    background: var(--brand-cyan-soft) !important;
}

.op-hero,
.op-panel,
.op-card,
.op-auth-card,
.op-action-bar,
.auth-card,
.login-card,
.registration-card,
.form-card {
    border-color: var(--brand-border) !important;
    box-shadow: 0 10px 30px rgba(16, 35, 63, .07) !important;
}

.account-type-card.selected,
.profile-type-option.is-selected,
.registration-type-option.is-selected {
    color: var(--brand-navy) !important;
    background: var(--brand-cyan-soft) !important;
    border-color: var(--brand-cyan) !important;
}

.profile-completion-banner {
    color: var(--brand-ink) !important;
    background: var(--brand-cyan-soft) !important;
    border-color: #BDEBFB !important;
}

.profile-completion-banner a,
.profile-completion-percent {
    color: var(--brand-navy) !important;
}

/* Footer */
body > footer {
    color: #fff !important;
    background: var(--brand-ink) !important;
    border-top: 4px solid var(--brand-cyan);
}

body > footer .footer-content {
    color: #fff !important;
}

.footer-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    width: 100%;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, .14);
}

.footer-brand img {
    flex: 0 0 44px;
    border-radius: 0;
}

.footer-brand div {
    display: grid;
    text-align: start;
}

.footer-brand strong {
    color: #fff;
    font-family: "Inter", system-ui, sans-serif;
    font-size: 1.08rem;
    letter-spacing: .01em;
}

.footer-brand span {
    color: #C8D2E1;
    font-size: .78rem;
}

body > footer .quick-links-title,
body > footer h4 {
    color: #fff !important;
}

body > footer .quick-link,
body > footer .footer-link,
body > footer .footer-text {
    color: #C8D2E1 !important;
}

body > footer .quick-link:hover,
body > footer .footer-link:hover {
    color: #7ADFFF !important;
}

body > footer .footer-social-link {
    color: #fff !important;
    background: rgba(255, 255, 255, .08) !important;
    border: 1px solid rgba(255, 255, 255, .18) !important;
}

body > footer .footer-social-link:hover {
    color: var(--brand-ink) !important;
    background: var(--brand-cyan) !important;
    border-color: var(--brand-cyan) !important;
}

body > footer .footer-quick-links,
body > footer .footer-copyright {
    border-color: rgba(255, 255, 255, .14) !important;
}

/* Keep semantic meanings distinct from brand decoration. */
.text-success,
.status-active,
.badge-success,
.alert-success {
    color: #0D7753;
}

.text-warning,
.status-urgent,
.badge-warning,
.alert-warning {
    color: #9A5809;
}

.text-danger,
.status-error,
.badge-danger,
.alert-danger,
.user-menu-item-danger {
    color: #A92E3D;
}

.status-archived,
.badge-secondary {
    color: #58667A;
}

@media (max-width: 1420px) {
    .brand-text {
        display: none !important;
    }

    .header-nav .nav-link {
        padding-inline: 8px !important;
        font-size: .82rem;
    }
}

@media (max-width: 1100px) {
    header {
        min-height: 66px !important;
    }

    .header-container {
        min-height: 60px !important;
        padding-inline: 14px !important;
    }

    .logo-container,
    .logo-container picture {
        width: 48px !important;
        height: 48px !important;
    }

    .global-search-panel {
        top: 72px;
    }

    .footer-brand {
        justify-content: flex-start;
    }
}

@media (max-width: 680px) {
    .global-search-trigger {
        width: 38px;
        height: 38px;
    }

    .global-search-panel {
        top: 70px;
        width: min(100% - 20px, 760px);
    }

    .global-search-panel-inner {
        padding: 14px;
    }

    .global-search-form {
        grid-template-columns: 1fr;
    }

    .global-search-form > button {
        width: 100%;
    }
}

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