/* Additions on top of the copied theme (things the original did in JS/Vue). */
.custom-select__dropdown[hidden], .custom-select__backdrop[hidden] { display: none; }
.custom-select__dropdown-item { display: block; text-decoration: none; color: inherit; }
.swap-btn { background: none; border: 0; padding: 0; display: inline-flex; cursor: pointer; color: inherit; }
.alert-box[data-alert] { pointer-events: none; }
a.base-button, a.header__profile-btn { text-decoration: none; }
.header__profile-btn { display: inline-flex; align-items: center; }
[data-reveal] { opacity: 1; }
.form-error { color: #e40004; font-size: 12px; margin-top: 4px; display: block; }
.input-base.has-error .input-base__content { border-color: #e40004; }

/* Floating label: the copied site.css lost the :has() wrapper, so the label only rose on focus
   and fell back over a pre-filled value (e.g. e-mail kept after a failed login). Restore the
   "lift when the field has a value" behaviour. Label is a sibling of the input, so scope at .input-base. */
.input-base:has(.input-base__input:focus) .input-base__label,
.input-base:has(.input-base__input:not(:placeholder-shown)) .input-base__label {
  transform: translateY(0);
  font-size: .75rem;
  top: -50%;
}

/* Font Awesome core (the original injected this from JS) */
.svg-inline--fa { display: inline-block; height: 1em; overflow: visible; vertical-align: -0.125em; }
.svg-inline--fa[hidden] { display: none !important; }
svg:not(:root).svg-inline--fa, svg:not(:host).svg-inline--fa { overflow: visible; box-sizing: content-box; }

/* modals are plain elements here (the original mounted them conditionally) */
.modal[hidden] { display: none; }
[data-qr][hidden], [data-dep-address-block][hidden], [data-cv-preview][hidden], .modal__error[hidden], .max-btn[hidden] { display: none; }
.qr__box img { display: block; }
.address-copy .address-text { overflow-wrap: anywhere; }
a.admin-panel-btn, a.transaction-history__view-all { text-decoration: none; }
.settings-card__content form { display: contents; }

/* backoffice helpers on top of the copied admin CSS */
.bo-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 20px; }
.bo-h1 { font-size: clamp(22px, 3vw, 32px); font-weight: 700; }
.bo-h1 .hint { font-weight: 400; }
.bo-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; margin-bottom: 20px; }
.bo-stat { display: flex; flex-direction: column; gap: 6px; text-decoration: none; color: inherit; }
.bo-stat__label { color: #6b7280; font-size: 14px; }
.bo-stat__value { font-size: 32px; font-weight: 700; line-height: 1; }
.bo-stat__note { color: #ffb300; font-size: 13px; }
.bo-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
.bo-span-2 { grid-column: 1 / -1; }
.bo-stack { display: flex; flex-direction: column; gap: 20px; }
.bo-table-wrap { overflow-x: auto; }
.bo-narrow { max-width: 860px; }
.bo-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.bo-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.bo-field--check { flex-direction: row; align-items: center; gap: 10px; }
.bo-field__label { color: #6b7280; font-size: 13px; }
.bo-input { width: 100%; padding: 10px 14px; border: 1px solid #e5e7eb; border-radius: 10px; background: #fff; font: inherit; font-size: 15px; outline: none; }
.bo-input:focus { border-color: #ffc107; }
.bo-input--sm { padding: 6px 10px; font-size: 13px; width: auto; min-width: 150px; }
.bo-inline { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.bo-filters { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.bo-checks { display: flex; gap: 24px; flex-wrap: wrap; margin: 8px 0; }
.bo-break { overflow-wrap: anywhere; }
.header-admin__link.is-active { background: #ffc107; color: #111; }
a.btn { text-decoration: none; display: inline-flex; align-items: center; justify-content: center; }
@media (max-width: 900px) { .bo-grid-2, .bo-form-grid { grid-template-columns: 1fr; } }

/* backoffice tables and button variants (the original admin used CSS grid rows) */
.admin-view .users-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.admin-view .users-table th { text-align: left; padding: 10px 12px; border-bottom: 2px solid #ffb300; font-weight: 700; white-space: nowrap; }
.admin-view .users-table td { padding: 12px; border-bottom: 1px solid #f1e6c9; vertical-align: top; }
.admin-view .users-table tbody tr:hover { background: #ffc10714; }
.admin-view .users-table tbody tr:last-child td { border-bottom: 0; }
.admin-view .btn--light { background: #fff; border: 1px solid #f0e6c0; color: #111; }
.admin-view .btn--light:hover { background: #fff8e1; }
.admin-view .btn { border-radius: 12px; padding: 8px 14px; font-weight: 600; }
.admin-view .btn--small { padding: 6px 12px; font-size: 13px; }
.admin-view .card { padding: 18px 20px; }
.admin-view .card__title { font-weight: 700; font-size: 17px; margin-bottom: 14px; }
.admin-view .form { display: flex; flex-direction: column; gap: 14px; }
.admin-view .balances { display: flex; flex-direction: column; gap: 8px; margin: 10px 0; }
.admin-view .balances__row { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid #f1e6c9; }
.admin-view .balance__name { color: #6b7280; text-transform: none; }
.admin-view .tx-list { display: flex; flex-direction: column; gap: 10px; }
.admin-view .tx { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; padding: 8px 0; border-bottom: 1px solid #f1e6c9; }
.admin-view .tx:last-child { border-bottom: 0; }
.admin-view .tx__meta { display: flex; flex-direction: column; gap: 2px; }
.admin-view .tx__title { font-weight: 600; }
.admin-view .tx__date, .admin-view .hint { color: #6b7280; font-size: 12px; }
.admin-view .empty { color: #9ca3af; padding: 12px 0; }
.admin-view .mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; }
.admin-view .link { color: #b47b00; text-decoration: none; font-weight: 600; }
.admin-view .link:hover { text-decoration: underline; }
.admin-view .switch input { width: 18px; height: 18px; }
.admin-view .form-error { color: #e40004; font-size: 12px; }

/* nav badges: how many items in that section wait for a staff decision */
.admin-view .header-admin__link { position: relative; }
.admin-view .bo-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; margin-left: 6px; padding: 0 5px;
  border-radius: 9px; background: #e40004; color: #fff;
  font-size: 11px; font-weight: 700; line-height: 1; vertical-align: middle;
}
.admin-view .header-admin__link.is-active .bo-badge { background: #111; }
.admin-view .bo-badge[hidden] { display: none !important; }  /* count 0: CSS display beats the hidden attribute */

/* new items arrived on the section you're viewing: nudge its nav button to refresh */
.admin-view .header-admin__link--new { cursor: pointer; }
.admin-view .header-admin__link--new::after { content: "\21bb"; margin-left: 5px; font-weight: 700; color: #b47b00; display: inline-block; animation: bo-badge-pulse 1.4s ease-in-out infinite; }
.admin-view .header-admin__link--new .bo-badge { animation: bo-badge-pulse 1.4s ease-in-out infinite; }
@keyframes bo-badge-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }

/* account verification marks */
.user-info__badge--pending { background-color: #f1f2f4 !important; color: #6b7280 !important; }
.user-info__badge--pending svg { color: #9ca3af !important; }
.admin-view .bo-verified svg { width: 14px; height: 14px; color: #15a566; vertical-align: -2px; }

/* reveal + mobile menu: the original relied on Vue-scoped selectors, so force the visible state */
main .is-visible, main [data-reveal].is-visible { opacity: 1 !important; transform: none !important; }
main > section, main > div, main > article { opacity: 1; }
body.menu-open .header__menu { clip-path: circle(150% at 0 0) !important; pointer-events: auto !important; box-shadow: 0 2px 14px #0000000f; }

/* back-office awards gallery manager */
.admin-view .bo-awards-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 12px; }
.admin-view .bo-award { border: 1px solid #f1e6c9; border-radius: 10px; overflow: hidden; background: #fff; }
.admin-view .bo-award img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; }
.admin-view .bo-award--off { opacity: .5; }
.admin-view .bo-award__meta { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 6px 8px; }

/* logout button in the admin nav: look like a nav link, not a form button */
.admin-view .header-admin__logout { margin: 0; display: inline-flex; }
.admin-view .header-admin__link--logout { background: none; border: 0; font: inherit; cursor: pointer; display: inline-flex; align-items: center; gap: 5px; }
.admin-view .header-admin__link--logout:hover { opacity: .75; }

/* cabinet verification card */
.verify-card__body { padding: 1.25rem 1.5rem 1.5rem; }
.verify-card__status { display:flex; align-items:center; gap:8px; font-weight:600; margin:0; }
.verify-card__status--ok { color:#15a566; }
.verify-card__status--wait { color:#b47b00; }
.verify-card__status svg { width:18px; height:18px; }
.verify-card__hint { color:#4f4f4f; font-size:14px; line-height:1.55; margin:0 0 16px; }
.verify-card__list { list-style:none; padding:0; margin:0 0 14px; }
.verify-card__list li { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid #f1e6c9; font-size:14px; }
.verify-card__date { color:#9e9e9e; }
.verify-card__form { display:flex; flex-direction:column; gap:12px; }
.verify-card__select, .verify-card__file { width:100%; padding:10px 12px; border:1px solid #f0e6c0; border-radius:10px; background:#fff; font:inherit; }
.verify-card__btn { align-self:flex-start; margin-top:4px; }

/* admin verification queue */
.admin-view .verify-request { margin-bottom: 14px; }
.admin-view .verify-request__head { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.admin-view .verify-request__head .hint { display:block; }
.admin-view .verify-request__docs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.admin-view .verify-request__actions { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.admin-view .verify-request__actions .bo-input { flex:1 1 220px; }

/* verification queue: doc chip with delete */
.admin-view .verify-doc { display:inline-flex; align-items:center; gap:4px; }
.admin-view .verify-doc__del { display:inline; }
.admin-view .doc-actions { display:inline-flex; gap:8px; align-items:center; }

/* cabinet: copyable identifier */
.user-info__value.copyable { cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.user-info__value.copyable .svg-inline--fa { width: 13px; height: 13px; opacity: .55; }
.user-info__value.copyable:hover .svg-inline--fa { opacity: 1; }