/* =====================================================================
   Al Basha — admin panel select styling.

   Botble's admin ships select2, whose dropdown IS real DOM (unlike a native
   <select> popup, which the OS draws and CSS cannot reach). That means the
   admin dropdowns can be given the Al Basha identity directly.

   Scope is deliberately narrow: form controls only. The admin dashboard
   layout, tables, and navigation are untouched.
   ===================================================================== */

:root {
    --ab-admin-gold: #c8a25d;
    --ab-admin-gold-hi: #ddbd77;
    --ab-admin-surface: #17171a;
    --ab-admin-surface-2: #1e1e18;
    --ab-admin-line: rgba(247, 242, 232, .14);
    --ab-admin-line-strong: rgba(200, 162, 93, .45);
    --ab-admin-fg: #f4f0e2;
    --ab-admin-muted: #a9a59c;
    --ab-admin-radius: 3px;
}

/* --- Closed control --- */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    min-height: 40px;
    color: var(--ab-admin-fg);
    background: var(--ab-admin-surface);
    border: 1px solid var(--ab-admin-line);
    border-radius: var(--ab-admin-radius);
    transition: border-color .25s ease, background-color .25s ease, box-shadow .25s ease;
}

.select2-container--default .select2-selection--single:hover,
.select2-container--default .select2-selection--multiple:hover {
    border-color: rgba(200, 162, 93, .34);
    background: var(--ab-admin-surface-2);
}

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--multiple {
    border-color: var(--ab-admin-line-strong);
    background: var(--ab-admin-surface-2);
    box-shadow: 0 0 0 3px rgba(200, 162, 93, .12);
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-inline: 12px;
    color: var(--ab-admin-fg);
    line-height: 38px;
    font-weight: 700;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: var(--ab-admin-muted);
    font-weight: 600;
}

/* Arrow: replace the default triangle with a gold chevron. */
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 38px;
    width: 30px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    width: 9px;
    height: 9px;
    margin: -5px 0 0 -5px;
    border: 0;
    border-inline-end: 2px solid var(--ab-admin-gold);
    border-block-end: 2px solid var(--ab-admin-gold);
    transform: rotate(45deg);
    transition: transform .28s cubic-bezier(.16, .84, .44, 1);
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    transform: rotate(225deg);
    margin-top: -2px;
}

/* --- Dropdown panel --- */
.select2-container--default .select2-dropdown {
    overflow: hidden;
    background: var(--ab-admin-surface);
    border: 1px solid var(--ab-admin-line-strong);
    border-radius: var(--ab-admin-radius);
    box-shadow: 0 26px 60px -24px rgba(0, 0, 0, .95);
}

/* Gold hairline across the panel head, matching the site header. */
.select2-container--default .select2-dropdown::before {
    position: absolute;
    inset-inline: 0;
    top: 0;
    height: 1px;
    content: "";
    background: linear-gradient(90deg, transparent, var(--ab-admin-gold), transparent);
    opacity: .75;
    pointer-events: none;
}

.select2-container--default .select2-search--dropdown {
    padding: 8px;
    background: var(--ab-admin-surface);
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    height: 38px;
    padding: 0 12px;
    color: var(--ab-admin-fg);
    background: var(--ab-admin-surface-2);
    border: 1px solid var(--ab-admin-line);
    border-radius: 2px;
    outline: none;
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: var(--ab-admin-line-strong);
    box-shadow: 0 0 0 3px rgba(200, 162, 93, .12);
}

.select2-container--default .select2-results > .select2-results__options {
    max-height: 270px;
    padding: 6px;
    scrollbar-width: thin;
    scrollbar-color: rgba(200, 162, 93, .5) transparent;
}

.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar {
    width: 6px;
}

.select2-container--default .select2-results > .select2-results__options::-webkit-scrollbar-thumb {
    background: rgba(200, 162, 93, .45);
    border-radius: 3px;
}

.select2-container--default .select2-results__option {
    padding: 10px 12px;
    color: rgba(244, 240, 226, .8);
    background: transparent;
    border-radius: 2px;
    font-weight: 700;
    transition: color .2s ease, background-color .2s ease;
}

.select2-container--default .select2-results__option--highlighted[aria-selected],
.select2-container--default .select2-results__option--highlighted[data-selected],
.select2-container--default .select2-results__option--highlighted {
    color: var(--ab-admin-fg);
    background: rgba(200, 162, 93, .14);
}

.select2-container--default .select2-results__option[aria-selected="true"],
.select2-container--default .select2-results__option[data-selected="true"],
.select2-container--default .select2-results__option--selected {
    color: #12120f;
    background: var(--ab-admin-gold);
    font-weight: 900;
}

/* --- Multi-select tags --- */
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    margin: 5px 4px 0 0;
    padding: 3px 9px;
    color: #12120f;
    background: var(--ab-admin-gold);
    border: 0;
    border-radius: 2px;
    font-weight: 800;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #12120f;
    font-weight: 900;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: #3a2c08;
    background: transparent;
}

/* --- Plain native selects in admin: style the closed control only.
   Their popup is OS-drawn and cannot be reached by CSS. --- */
.form-select {
    border-radius: var(--ab-admin-radius);
}

.form-select:focus {
    border-color: var(--ab-admin-line-strong);
    box-shadow: 0 0 0 3px rgba(200, 162, 93, .12);
}

@media (prefers-reduced-motion: reduce) {
    .select2-container--default .select2-selection--single,
    .select2-container--default .select2-selection--single .select2-selection__arrow b,
    .select2-container--default .select2-results__option {
        transition-duration: 1ms !important;
    }
}

/* =====================================================================
   LOCAL DEMO ONLY — hide the publisher's license UI in the admin panel.

   Requested for local testing so client-facing demos do not show the
   Botble license banner, modal, or activation fields.

   THIS IS COSMETIC ONLY.
   It hides interface elements with CSS. It does NOT patch, bypass, or
   disable any license verification: no route, controller, service, or
   core file was modified, and the licence state of the installation is
   exactly what it was before.

   To restore the publisher's license UI, delete this block and re-publish:
     script/platform/plugins/al-basha-operations/public/css/al-basha-admin.css
   ===================================================================== */

/* Sticky "Your license is invalid…" banner at the top of the admin. */
.alert-license,
[data-bb-toggle="license-reminder"] {
    display: none !important;
}

/* Quick activation modal. */
#quick-activation-license-modal {
    display: none !important;
}

/* License section and its fields on Settings → General
   (wraps the purchase code, buyer, and agreement inputs). */
#license-form {
    display: none !important;
}


/* =====================================================================
   Al Basha — admin panel refinement.

   Deliberately conservative. This only adjusts surface, border, radius,
   spacing and typography on Botble/Tabler primitives. It does NOT change
   layout, grid, positioning, widths, or the sidebar/navbar structure, so
   the dashboard cannot break — every rule is reversible by deleting this
   block.
   ===================================================================== */

/* --- Cards: quieter surface, sharper Al Basha geometry --- */
.card {
    border: 1px solid var(--ab-admin-line);
    border-radius: var(--ab-admin-radius);
    box-shadow: 0 14px 34px -26px rgba(0, 0, 0, .7);
}

.card-header {
    border-bottom: 1px solid var(--ab-admin-line);
}

.card-header .card-title {
    font-weight: 800;
    letter-spacing: .01em;
}

/* Gold hairline along the top of every card — the one brand cue that
   carries through from the public site. */
.card > .card-header:first-child {
    position: relative;
}

.card > .card-header:first-child::before {
    position: absolute;
    inset-inline: 0;
    top: 0;
    height: 1px;
    content: "";
    background: linear-gradient(90deg, transparent, rgba(200, 162, 93, .55), transparent);
    pointer-events: none;
}

.card-footer {
    border-top: 1px solid var(--ab-admin-line);
}

/* --- Buttons --- */
.btn {
    border-radius: var(--ab-admin-radius);
    font-weight: 700;
}

.btn-primary {
    color: #12120f;
    background-color: var(--ab-admin-gold);
    border-color: var(--ab-admin-gold);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    color: #12120f;
    background-color: var(--ab-admin-gold-hi);
    border-color: var(--ab-admin-gold-hi);
}

.btn-primary:focus-visible {
    box-shadow: 0 0 0 3px rgba(200, 162, 93, .3);
}

.btn-outline-primary {
    color: var(--ab-admin-gold);
    border-color: var(--ab-admin-gold);
}

.btn-outline-primary:hover {
    color: #12120f;
    background-color: var(--ab-admin-gold);
    border-color: var(--ab-admin-gold);
}

/* --- Inputs, to match the select styling above --- */
.form-control,
.form-select,
.input-group-text {
    border-radius: var(--ab-admin-radius);
}

.form-control:focus,
.form-select:focus {
    border-color: var(--ab-admin-line-strong);
    box-shadow: 0 0 0 3px rgba(200, 162, 93, .12);
}

.form-label {
    font-weight: 700;
}

.form-check-input:checked {
    background-color: var(--ab-admin-gold);
    border-color: var(--ab-admin-gold);
}

/* --- Tables: calmer header, clearer rows --- */
.table thead th {
    color: var(--ab-admin-muted);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.table > :not(caption) > * > * {
    padding-block: .7rem;
}

.table-hover > tbody > tr:hover > * {
    background-color: rgba(200, 162, 93, .06);
}

/* --- Badges --- */
.badge {
    border-radius: 2px;
    font-weight: 800;
    letter-spacing: .02em;
}

/* --- Sidebar: gold active state instead of the stock accent --- */
.navbar-vertical .nav-link.active,
.navbar-vertical .nav-link[aria-current="page"] {
    color: var(--ab-admin-gold);
    box-shadow: inset 2px 0 0 var(--ab-admin-gold);
}

.navbar-vertical .nav-link:hover {
    color: var(--ab-admin-gold-hi);
}

/* --- Page header spacing --- */
.page-header {
    margin-block-end: 1.1rem;
}

.page-title {
    font-weight: 800;
}

/* --- Links --- */
a:not(.btn):not(.nav-link):not(.dropdown-item) {
    color: var(--ab-admin-gold);
}

a:not(.btn):not(.nav-link):not(.dropdown-item):hover {
    color: var(--ab-admin-gold-hi);
}

/* --- Pagination --- */
.page-item.active .page-link {
    color: #12120f;
    background-color: var(--ab-admin-gold);
    border-color: var(--ab-admin-gold);
}

/* --- Dashboard stat tiles keep their colour, just the Al Basha geometry --- */
.card .h1,
.card .h2 {
    font-weight: 900;
}

@media (prefers-reduced-motion: reduce) {
    .card,
    .btn,
    .table-hover > tbody > tr {
        transition-duration: 1ms !important;
    }
}

