/*
 * "Hedvig" site theme: dark page, dark cards with a hairline border, orange accent, floating capsule header,
 * footer as a rounded panel. Loaded after site.css only when Site Ayarları → Site teması = Hedvig;
 * the classic (light) design is untouched.
 */
:root {
    color-scheme: dark;

    --bg: #000000;
    --surface: #111111;
    --surface-2: #1A1A1A;
    --text: #E6E6E6;
    --text-strong: #FFFFFF;
    --text-soft: #CCCCCC;
    --muted: #999999;
    --muted-2: #8A90A0;
    --accent: #FE6819;
    --accent-2: #FE6819;
    --line: rgba(255, 255, 255, .09);
    --line-strong: rgba(255, 255, 255, .16);
    --shadow: none;
}

::selection { background: rgba(254, 104, 25, .35); color: #fff; }

/* ------------------------------------------------------------------ buttons */

.button { background: var(--accent); color: #fff; }
.button:hover { opacity: 1; background: #FF7A33; }
.button--ghost { background: transparent; color: var(--text-strong); box-shadow: inset 0 0 0 1px var(--line-strong); }
.button--ghost:hover { background: rgba(255, 255, 255, .06); }
.button--inverse { background: var(--accent); color: #fff; }
.button--light { background: #fff; color: #000; }
.button--light:hover { background: #F2F2F2; }

/* ------------------------------------------------------------------ header: floating capsule */

.site-header { padding: 14px var(--gutter) 0; background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
.site-header__inner {
    max-width: 1000px; padding: 6px 8px 6px 20px; border-radius: 999px;
    background: rgba(17, 17, 17, .72); border: 1px solid var(--line);
    backdrop-filter: saturate(1.4) blur(16px); -webkit-backdrop-filter: saturate(1.4) blur(16px);
}
.site-header__brand img { height: 40px; }
@media (max-width: 640px) { .site-header__brand img { height: 34px; } }

.site-nav__list { background: transparent; padding: 0; }
.site-nav__link { color: #D9D9D9; }
.site-nav__link:hover, .site-nav__link[aria-current="page"] { background: rgba(255, 255, 255, .08); color: #fff; }
.site-nav__submenu { background: var(--surface); border: 1px solid var(--line); }
.site-nav__submenu a:hover { background: rgba(255, 255, 255, .06); }

.cart-link, .nav-toggle { width: 40px; height: 40px; background: rgba(255, 255, 255, .06); color: #fff; }
.nav-toggle__bars, .nav-toggle__bars::before, .nav-toggle__bars::after { background: #fff; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bars { background: transparent; }

.lang-menu { background: rgba(255, 255, 255, .06); }
.lang-menu a[aria-current="true"] { background: #fff; color: #000; }

/* The open mobile menu turns the capsule into a rounded panel */
@media (max-width: 860px) {
    .site-header__inner:has(.site-nav.is-open) { border-radius: 24px; padding-bottom: 10px; }
    .site-nav__list { padding: 6px 0 0; }
}

/* ------------------------------------------------------------------ shared */

.eyebrow--pill { background: var(--surface); border: 1px solid var(--line); box-shadow: none; }
.badge { background: rgba(254, 104, 25, .14); color: #FF8F52; }
.prose hr { border-top-color: var(--line-strong); }
.price-item__dots { border-color: rgba(255, 255, 255, .22); }

/* Cards: dark surface with a hairline border instead of a shadow */
:is(.tile, .feature, .compare__col, .plan, .testimonial, .faq__item, .order-box, .auth-box, .cart-line, .cart-summary,
    .checkout-step, .checkout__summary, .player__side, .facts, .event-card, .notice, .flip__front) {
    border: 1px solid var(--line); box-shadow: none;
}
.tile:has(.tile__link):hover { box-shadow: none; border-color: var(--line-strong); }
.event-card:hover { box-shadow: none; border-color: var(--line-strong); }

/* Card photos fade into the card, as on Hedvig */
.tile__media:has(+ .tile__body) { -webkit-mask-image: linear-gradient(to bottom, #000 72%, transparent); mask-image: linear-gradient(to bottom, #000 72%, transparent); }
.product-card .tile__media { -webkit-mask-image: none; mask-image: none; }

.feature__icon { background: rgba(255, 255, 255, .06); }
.tile__media + .tile__body .tile__icon { background: var(--surface-2); }

/* Comparison: the highlighted column is a deep blue-grey panel */
.compare__col--highlight { background: linear-gradient(160deg, #22404C, #142630); color: #E4ECEF; border-color: rgba(255, 255, 255, .12); }

/* Pricing: both plans alike, the highlighted one has the orange button; orange ticks without a disc */
.plan--highlight { background: var(--surface); color: var(--text); border-color: var(--line-strong); }
.plan--highlight .button:not(.button--ghost) { background: var(--accent); color: #fff; }
.plan--highlight .plan__name, .plan--highlight .plan__price, .plan--highlight .button--ghost { color: #fff; }
.checkout-step legend span { color: #000; }
.plan__features li::before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FE6819' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 16px no-repeat;
}

/* Banner without a chosen colour: a dark panel that still stands out from the black page */
.cta { border: 1px solid var(--line); }
.cta--plain { border: 0; }

/* Boxes are dark here: their text stays light, whatever the section's text colour (unless the box colour is light) */
.pb:not(.pb--box-light) :is(.tile, .feature, .compare__col, .plan, .testimonial, .faq__item, .eyebrow--pill, .chip, .order-box, .flip__front, .cs__slide--text, .split, .signup__notice) {
    --text: #E6E6E6; --text-strong: #FFFFFF; --text-soft: #CCCCCC; --muted: #999999; color: var(--text);
}

/* ------------------------------------------------------------------ sliders & carousels */

.carousel__arrow, .cs__arrow, .cs__pause { background: rgba(26, 26, 26, .9); color: #fff; border: 1px solid var(--line); box-shadow: none; }
.cs__dot { background: rgba(255, 255, 255, .25); }
.cs__dot[aria-current="true"] { background: #fff; }
.flip__hint { color: #111; }

/* ------------------------------------------------------------------ shop */

.category-tile__name { background: rgba(0, 0, 0, .55); color: #fff; }
.category-tile:hover .category-tile__name { background: rgba(0, 0, 0, .7); }
.category-tile[aria-current="page"] .category-tile__media { box-shadow: 0 0 0 2px #fff; }
.chip { background: var(--surface); border: 1px solid var(--line); }
.chip[aria-current="page"] { background: #fff; color: #000; border-color: #fff; }
/* Stronger than the light text of boxes in sections (above): a selected chip is white, its text black. */
.pb:not(.pb--box-light) .chip[aria-current="page"] { color: #000; }
.product__description { background: var(--surface); border: 1px solid var(--line); }
.product__thumbs button[aria-current="true"] { border-color: #fff; }

/* ------------------------------------------------------------------ forms */

.sort-form select, .field select, .qty-input, .buy-form__personalization input, .buy-form__variant-description,
.form-field input, .form-field select, .form-field textarea {
    background: var(--surface-2); border-color: var(--line-strong); color: var(--text);
}
.search-form { border: 1px solid var(--line-strong); }
.search-form:focus-within { box-shadow: 0 0 0 3px rgba(254, 104, 25, .3); }
.buy-form__personalization input:focus, .form-field input:focus, .form-field select:focus, .form-field textarea:focus { box-shadow: 0 0 0 3px rgba(254, 104, 25, .2); }
.notice--error { background: rgba(217, 48, 37, .16); color: #FF9A8F; }
.badge--soon { background: rgba(254, 104, 25, .14); color: #FF8F52; }
.form-field__error, .check.has-error { color: #FF9A8F; }

/* ------------------------------------------------------------------ workshops, checkout, account, courses */

.date-list li { background: rgba(255, 255, 255, .05); }
.seats { color: #5BD68F; }
.session-option, .choice { border-color: var(--line); }
.session-option:has(input:checked), .choice:has(input:checked) { border-color: #fff; }
.checkout-shipping-address, .summary-lines li, .summary-totals__total { border-color: var(--line); }
.curriculum li { border-bottom-color: var(--line); }
.curriculum__check { background: rgba(255, 255, 255, .08); }
.curriculum--nav a:hover { background: rgba(255, 255, 255, .06); }
.curriculum--nav .is-current a { background: #fff; color: #000; }
.curriculum--nav .is-current .curriculum__check { background: rgba(0, 0, 0, .1); color: #000; }
.curriculum--nav .is-done .curriculum__check { background: rgba(91, 214, 143, .15); color: #5BD68F; }
.progress { background: rgba(255, 255, 255, .1); }

/* ------------------------------------------------------------------ footer: a rounded panel */

.site-footer {
    width: calc(100% - 2 * var(--gutter)); max-width: calc(var(--container) - 2 * var(--gutter));
    margin: var(--space-7) auto var(--gutter); padding-block: var(--space-6) var(--space-4); border-radius: var(--radius-lg);
    border: 1px solid var(--line); color: #B3B3B3;
    background: radial-gradient(120% 90% at 50% 0%, #1C2A33 0%, #0B1015 55%, #050709 100%);
}
.site-footer .container { padding-inline: clamp(20px, 4vw, 48px); }
.site-footer a:hover { color: #fff; }

/* Newsletter at the top, centred like Hedvig's closing call to action */
.newsletter { grid-template-columns: 1fr; justify-items: center; text-align: center; border-bottom-color: var(--line); }
.site-footer__brand { font-size: clamp(1.75rem, 3.5vw, 2.5rem); color: #fff; }
.site-footer__heading, .newsletter__notice { color: #fff; }
.newsletter__form { width: min(460px, 100%); justify-content: center; }
.newsletter__form input[type="email"] { background: rgba(255, 255, 255, .06); border-color: var(--line-strong); color: #fff; }
.site-footer__bottom { border-top-color: var(--line); }

/* ------------------------------------------------------------------ newer blocks */

.split { border: 1px solid var(--line); }
@media (min-width: 761px) and (min-height: 640px) {
    .split-list--stack .split { box-shadow: 0 -12px 40px -10px rgba(0, 0, 0, .8); }
}
.video-embed__play { background: var(--accent); color: #fff; }
.signup__form input[type="email"] { background: var(--surface-2); border-color: var(--line-strong); }
.signup__form input[type="email"]:focus { box-shadow: 0 0 0 3px rgba(254, 104, 25, .25); }
.signup__notice { border: 1px solid var(--line); }

/* Header height in this theme (14px above the 54px capsule) */
:root { --header-h: 68px; }
@media (max-width: 640px) { :root { --header-h: 68px; } }