/* Booker / Entertainer action language. Uses the existing Nioicons font.
   Loaded after the legacy theme so buttons and statuses share one set of metrics. */
.nk-body:is(.portal-booker, .portal-entertainer) .portal-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    max-width: 100%;
    min-height: 44px;
    padding: 10px 14px;
    border-radius: 8px !important;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    white-space: normal;
    text-decoration: none;
    vertical-align: middle;
}
.nk-body:is(.portal-booker, .portal-entertainer) .portal-action > span { min-width: 0; }
.nk-body:is(.portal-booker, .portal-entertainer) :is(.btn, .portal-action, .cx-bookings-action, .cx-team-btn, .cx-super-btn, .cx-booker-quote-action, .cx-agent-record-action, .cx-fin-download, .cx-fin-view, .cx-review-chat-button) > :is(.icon, svg) {
    flex: 0 0 18px;
    width: 18px !important;
    height: 18px !important;
    margin: 0 !important;
    font-size: 18px !important;
    line-height: 18px !important;
    color: inherit !important;
}
.nk-body:is(.portal-booker, .portal-entertainer) :is(.btn, .portal-action, .cx-bookings-action, .cx-team-btn, .cx-super-btn, .cx-booker-quote-action, .cx-agent-record-action, .cx-fin-download, .cx-fin-view, .cx-review-chat-button):has(> .icon) { gap: 8px; }
.nk-body:is(.portal-booker, .portal-entertainer) .btn > .icon + span { padding-left: 0; }
/* Secondary actions, including Review quote, use charcoal in both portals. */
.nk-body.nk-body:is(.portal-booker, .portal-entertainer) :is(.btn.btn-outline-light, .btn.btn-outline-secondary, .btn.btn-outline-primary, .btn.btn-dark, .portal-action, .cx-quotes-premium .cx-quote-open-button):not(.btn-primary):not(.btn-success):not(.portal-action--primary):not(.btn-danger):not(.btn-outline-danger):not(.portal-action--danger) {
    background: var(--portal-surface-raised, #2B2B2B) !important;
    border: 1px solid #656565 !important;
    color: var(--portal-text, #EDEDED) !important;
    box-shadow: none !important;
}
.nk-body.nk-body:is(.portal-booker, .portal-entertainer) :is(.btn.btn-outline-light, .btn.btn-outline-secondary, .btn.btn-outline-primary, .btn.btn-dark, .portal-action, .cx-quotes-premium .cx-quote-open-button):not(.btn-primary):not(.btn-success):not(.portal-action--primary):not(.btn-danger):not(.btn-outline-danger):not(.portal-action--danger):is(:hover, :focus-visible) {
    background: #383838 !important;
    border-color: #8B8B8B !important;
}
/* Include body-level dialogs, wizards and controls whose old colour was inline. */
.nk-body.nk-body:is(.portal-booker, .portal-entertainer) :is(.btn.btn-primary, .btn.btn-success, .portal-action--primary, .portal-button--primary) {
    background: var(--portal-accent, #5B8060) !important;
    border-color: var(--portal-accent, #5B8060) !important;
    color: #FFF !important;
    border-radius: 8px !important;
}
.nk-body.nk-body:is(.portal-booker, .portal-entertainer) :is(.btn.btn-primary, .btn.btn-success, .portal-action--primary, .portal-button--primary):is(:hover, :focus-visible) {
    background: var(--portal-accent-hover, #48684C) !important;
    border-color: var(--portal-accent-hover, #48684C) !important;
}
/* Edit skills is a normal green button now; pink is only for the public site (Felix 2026-10-15). */
.nk-body.nk-body:is(.portal-booker, .portal-entertainer) .portal-action.portal-action--secondary {
    background: var(--portal-surface-raised, #2B2B2B) !important;
    border: 1px solid #656565 !important;
    color: var(--portal-text, #EDEDED) !important;
}
.nk-body.nk-body:is(.portal-booker, .portal-entertainer) .portal-action.portal-action--secondary:is(:hover, :focus-visible) { background: #383838 !important; border-color: #8B8B8B !important; }
.nk-body.nk-body:is(.portal-booker, .portal-entertainer) :is(.btn.btn-danger, .btn.btn-outline-danger, .portal-action.portal-action--danger) {
    background: #382928 !important;
    border-color: #C0625D !important;
    color: #FFD3CF !important;
}
.nk-body.nk-body:is(.portal-booker, .portal-entertainer) :is(.btn.btn-danger, .btn.btn-outline-danger, .portal-action.portal-action--danger):is(:hover, :focus-visible) { background: #503130 !important; }
.nk-body:is(.portal-booker, .portal-entertainer) :is(.btn, .portal-action):focus-visible { outline: 2px solid #9DBCA2 !important; outline-offset: 3px; }

.nk-body:is(.portal-booker, .portal-entertainer) .portal-action[hidden] { display: none !important; }

/* Status and category tag geometry is owned by portal-records.css. */
/* A long mobile card heading must not squeeze the status into a vertical word. */
.nk-body:is(.portal-booker, .portal-entertainer) .cx-mobile-record-card__header { flex-wrap: wrap; }
.nk-body:is(.portal-booker, .portal-entertainer) .cx-mobile-record-card__heading { flex: 1 1 140px; min-width: 0; }
.nk-body:is(.portal-booker, .portal-entertainer) .cx-mobile-record-card__header > .cx-status-badge { flex: 0 0 auto; }

.nk-body:is(.portal-booker, .portal-entertainer) .btn.btn-link:not(.text-danger) { color: var(--portal-text, #EDEDED) !important; }

/* One look for a button that can't be used yet, everywhere (Felix 2026-10-16 button audit; style
   guide section 1: #7E7E7E is for disabled controls). It used to be grey-on-grey in some places,
   faded to 45% or 70% in others, and full colour in pop-up footers. The :not(#…) adds an ID's weight, so
   this always beats the secondary button rule above (whose :not() list outweighed it, Felix 2026-10-17:
   pop-up "Download PDF" looked usable while switched off). */
/* U172 (Felix 2026-10-20): a button that is working (aria-busy) keeps its own colours and shows the spinner;
   only a button that can't be used looks switched off. */
.nk-body.nk-body.nk-body:is(.portal-booker, .portal-entertainer) :is(.btn, .portal-action, .portal-record-action):is(:disabled, .is-disabled, [aria-disabled="true"]):not([aria-busy="true"]):not(#portal-disabled-look) {
    background: var(--portal-surface-raised, #2B2B2B) !important; border-color: #474747 !important; color: #7E7E7E !important; opacity: 1 !important; cursor: not-allowed !important;
}
.nk-body.nk-body.nk-body:is(.portal-booker, .portal-entertainer) :is(.btn, .portal-action, .portal-record-action):is(:disabled, .is-disabled, [aria-disabled="true"]):not([aria-busy="true"]):not(#portal-disabled-look) :is(.icon, span) { color: inherit !important; }
.nk-body:is(.portal-booker, .portal-entertainer) .cx-quote-remove-link { margin-left: auto; }

/* Help is a quiet information control, not a boxed secondary action. */
.nk-body:is(.portal-booker, .portal-entertainer, .portal-admin) .portal-help {
    display: inline-flex;
    flex: 0 0 36px;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    min-width: 36px;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #B8B8B8;
    cursor: pointer;
    vertical-align: middle;
}
.nk-body:is(.portal-booker, .portal-entertainer, .portal-admin) .portal-help > .icon {
    width: 18px;
    height: 18px;
    font-size: 18px;
    line-height: 18px;
    color: inherit;
}
.nk-body:is(.portal-booker, .portal-entertainer, .portal-admin) .portal-help:is(:hover, [aria-expanded="true"]) { background: #383838; color: #FFF; }
.nk-body:is(.portal-booker, .portal-entertainer, .portal-admin) .portal-help:focus-visible { outline: 2px solid #9DBCA2; outline-offset: 2px; }
.nk-body:is(.portal-booker, .portal-entertainer, .portal-admin) .portal-help__popover {
    --bs-popover-bg: var(--portal-surface-raised, #2B2B2B);
    --bs-popover-border-color: #656565;
    --bs-popover-body-color: var(--portal-text, #EDEDED);
    max-width: min(320px, calc(100vw - 32px));
    border-radius: 8px;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.5;
    box-shadow: 0 8px 24px #0005;
}
.nk-body:is(.portal-booker, .portal-entertainer, .portal-admin) .portal-help__popover .popover-body { padding: 12px 14px; color: var(--portal-text, #EDEDED); }
.nk-body:is(.portal-booker, .portal-entertainer, .portal-admin) .portal-help__popover a { color: #B6D2BA !important; text-decoration: underline; }

/* Keep native selection/keyboard behaviour; give single selects a visible arrow.
   Custom select proxies, multi-select lists and Select2 own their own arrows. */
.nk-body.nk-body:is(.portal-booker, .portal-entertainer) select:not([multiple]):is(:not([size]), [size="1"]):not(.cx-select__native):not(.select2-hidden-accessible) {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23C5C5C5' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 16px 16px !important;
    background-color: var(--portal-surface-raised, #2B2B2B) !important;
    padding-right: 38px !important;
    padding-left: 12px;
    min-height: 44px;
    max-width: 100%;
    min-width: 0;
    border: 1px solid #656565;
    border-radius: 8px;
    color: var(--portal-text, #EDEDED);
    color-scheme: dark;
    cursor: pointer;
}
.nk-body:is(.portal-booker, .portal-entertainer) select:disabled { opacity: .65; cursor: not-allowed; }
.nk-body:is(.portal-booker, .portal-entertainer) input:is([type="time"], [type="date"]) {
    min-height: 44px;
    min-width: 0;
    max-width: 100%;
    border-radius: 8px;
    color-scheme: dark;
}
.nk-body:is(.portal-booker, .portal-entertainer) input:is([type="time"], [type="date"])::-webkit-calendar-picker-indicator {
    width: 18px;
    height: 18px;
    padding: 6px;
    margin: -6px -4px -6px 4px;
    opacity: .9;
    cursor: pointer;
}
.nk-body:is(.portal-booker, .portal-entertainer) :is(select, input[type="time"], input[type="date"]):not(:disabled):hover { border-color: #8B8B8B !important; }
.nk-body:is(.portal-booker, .portal-entertainer) :is(select, input[type="time"], input[type="date"]):focus-visible { outline: 2px solid #9DBCA2 !important; outline-offset: 2px; }
@media (max-width: 767.98px) {
    .nk-body:is(.portal-booker, .portal-entertainer) :is(select, input[type="time"], input[type="date"]) { font-size: 16px !important; }
}
@media (pointer: coarse), (max-width: 767.98px) {
    .nk-body:is(.portal-booker, .portal-entertainer, .portal-admin) .portal-help { width: 44px; height: 44px; min-width: 44px; flex-basis: 44px; }
}

/* Page controls for every list (resources/views/app/components/portal/pagination.blade.php).
   44px targets, 8px corners, the secondary button look; the current page uses the active tab green. */
.nk-body .portal-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.nk-body .portal-pager__summary { margin: 0; color: var(--portal-muted, #B5B5B5); font-size: 13px; line-height: 20px; }
.nk-body .portal-pager__list { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.nk-body .portal-pager__list > li { margin: 0; }
.nk-body :is(.portal-pager__step, .portal-pager__number) {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-width: 44px; min-height: 44px; padding: 10px 14px;
    border: 1px solid #656565; border-radius: 8px; background: var(--portal-surface-raised, #2B2B2B); color: var(--portal-text, #EDEDED);
    font-size: 13px; font-weight: 600; line-height: 20px; text-decoration: none;
}
.nk-body .portal-pager__number { padding: 10px 12px; }
.nk-body .portal-pager__step > .icon { font-size: 18px; line-height: 18px; }
.nk-body a:is(.portal-pager__step, .portal-pager__number):is(:hover, :focus-visible) { background: #383838; border-color: #8B8B8B; color: var(--portal-text, #EDEDED); }
.nk-body .portal-pager__number.is-current { background: #304034; border-color: #9DBCA2; }
.nk-body .portal-pager__step.is-disabled { color: #7E7E7E; border-color: #474747; cursor: default; }
.nk-body .portal-pager__gap > span { display: inline-flex; justify-content: center; min-width: 20px; color: #9A9A9A; }
@media (max-width: 575.98px) {
    .nk-body .portal-pager { justify-content: center; }
    .nk-body .portal-pager__summary { width: 100%; text-align: center; }
    .nk-body .portal-pager__page:not(:has(.is-current)), .nk-body .portal-pager__gap { display: none; }
}

/* One input style everywhere (style guide section 6; Felix 2026-10-17, U16). The theme's .form-control is
   36px with 13px text, which still showed on Create quote and any form without a rule of its own. Settings
   and the checkout already matched. Phones keep 16px text (app-overrides.css) so iPhones don't zoom. */
.nk-body.nk-body:is(.portal-booker, .portal-entertainer) .nk-content :is(input.form-control, select.form-control, .form-select) { min-height: 44px; }
@media (min-width: 768px) {
    .nk-body.nk-body:is(.portal-booker, .portal-entertainer) .nk-content :is(.form-control, .form-select) { font-size: 14px; color: var(--portal-text, #EDEDED); }
}

