/* =========================================================
   Rankat Ankat - dark team theme
   ========================================================= */

:root {
    --ra-bg: #121212;
    --ra-surface: #151515;
    --ra-surface-2: #1a1a1a;
    --ra-border: #2a2a2a;
    --ra-text: #e5e5e5;
    --ra-text-strong: #ffffff;

    --ra-primary: #c8102e;
    --ra-primary-hover: #e11d48;
    --ra-secondary: #f0c419;
}

/* perusvärit */
body,
.page-wrapper,
.page-main,
.columns,
.column.main,
.page-header,
.header.content,
.nav-sections,
.page-footer,
.footer.content {
    background: var(--ra-bg) !important;
    color: var(--ra-text) !important;
}

/* otsikot */
h1, h2, h3, h4, h5, h6,
.page-title,
.page-title span,
.block-title,
.block-title strong,
.subtitle,
legend,
label {
    color: var(--ra-text-strong) !important;
}

/* linkit */
a,
.page-header a,
.header.content a,
.header.links a,
.authorization-link a,
.minicart-wrapper .action.showcart,
.navigation a,
.table a,
.data.table a {
    color: var(--ra-primary) !important;
}

a:hover,
a:focus,
.page-header a:hover,
.header.content a:hover,
.navigation a:hover,
.table a:hover,
.data.table a:hover {
    color: var(--ra-primary-hover) !important;
}

/* napit */
.action.primary,
button.primary,
button.action.primary,
a.action.primary,
.checkout-index-index button.action.primary,
.checkout-index-index button.action.continue.primary,
.checkout-success .action.primary,
.checkout-success .action.continue {
    background: var(--ra-primary) !important;
    border: 1px solid var(--ra-primary) !important;
    color: #ffffff !important;
    background-image: none !important;
}

.action.primary:hover,
button.primary:hover,
button.action.primary:hover,
a.action.primary:hover,
.checkout-index-index button.action.primary:hover,
.checkout-index-index button.action.continue.primary:hover,
.checkout-success .action.primary:hover,
.checkout-success .action.continue:hover {
    background: var(--ra-primary-hover) !important;
    border-color: var(--ra-primary-hover) !important;
    color: #ffffff !important;
}

/* blockit ja kortit */
.block,
.sidebar .block,
.block-content,
.block-collapsible-nav,
.product-item-info,
.product-item-details,
.products-grid .product-item,
.products-list .product-item,
.minicart-wrapper .block-minicart,
.ui-dialog.mage-dropdown-dialog {
    background: var(--ra-surface) !important;
    color: var(--ra-text) !important;
    border-color: var(--ra-border) !important;
}

/* radionapit / checkout highlight */
.checkout-index-index input[type="radio"],
.checkout-index-index input[type="checkbox"] {
    accent-color: var(--ra-primary);
}

.checkout-index-index .radio + label:before,
.checkout-index-index input.radio + label:before,
.checkout-index-index input[type="radio"] + label:before {
    border: 2px solid var(--ra-primary) !important;
    background: var(--ra-bg) !important;
}

.checkout-index-index .radio:checked + label:after,
.checkout-index-index input.radio:checked + label:after,
.checkout-index-index input[type="radio"]:checked + label:after {
    background: var(--ra-primary) !important;
}

/* aktiiviset stepit */
.checkout-index-index .opc-progress-bar-item._active span,
.checkout-index-index .opc-progress-bar-item._active a {
    color: var(--ra-primary) !important;
}

.checkout-index-index .opc-progress-bar-item._active:before {
    background: var(--ra-primary) !important;
}

/* hakukenttä */
#search_mini_form .input-text,
#search_autocomplete {
    background: var(--ra-bg) !important;
    color: #ffffff !important;
    border: 1px solid var(--ra-border) !important;
}

/* tuotekuvien tausta tummaksi */
.product-image-container {
    background-color: #121212 !important;
}



/* =========================================================
   Customer-sivut
   ========================================================= */

/* Koko customer-sivun tausta mustaksi */
body[class*="customer-"],
body[class*="customer-"] .page-wrapper,
body[class*="customer-"] .page-main,
body[class*="customer-"] .columns,
body[class*="customer-"] .column.main {
    background: #000000 !important;
    color: #e5e5e5 !important;
}

/* Otsikot ja kenttien nimet valkoisiksi */
body[class*="customer-"] h1,
body[class*="customer-"] h2,
body[class*="customer-"] h3,
body[class*="customer-"] .page-title,
body[class*="customer-"] legend,
body[class*="customer-"] label {
    color: #ffffff !important;
}

/* Syöttökentät tummiksi */
body[class*="customer-"] input.input-text {
    background: #1a1a1a !important;
    color: #ffffff !important;
    border: 1px solid #2a2a2a !important;
}

/* Punainen reunus aktiiviseen kenttään */
body[class*="customer-"] input.input-text:focus {
    border-color: var(--ra-primary) !important;
    box-shadow: 0 0 0 1px var(--ra-primary) !important;
}

/* Salasanan vahvuusmittari */
body[class*="customer-"] .password-strength-meter {
    background: #1a1a1a !important;
    color: #e5e5e5 !important;
    border-color: #2a2a2a !important;
}


/* Customer-lomakkeen koko tausta mustaksi */
body[class*="customer-"] .form,
body[class*="customer-"] .form-create-account,
body[class*="customer-"] fieldset,
body[class*="customer-"] .fieldset,
body[class*="customer-"] .field,
body[class*="customer-"] .actions-toolbar {
    background: #000000 !important;
    color: #e5e5e5 !important;
}

body[class*="customer-"] .fieldset > .legend,
body[class*="customer-"] .fieldset > .field,
body[class*="customer-"] .control {
    background: #000000 !important;
}


/* =========================================================
   Customer login - kaikki taustat tummiksi
   ========================================================= */

body.customer-account-login .login-container,
body.customer-account-login .block,
body.customer-account-login .block-content,
body.customer-account-login .block-customer-login,
body.customer-account-login .block-new-customer,
body.customer-account-login .fieldset,
body.customer-account-login .field,
body.customer-account-login .control,
body.customer-account-login .actions-toolbar {
    background: #000000 !important;
    color: var(--ra-text) !important;
}

/* Otsikot ja tekstit */
body.customer-account-login .block-title,
body.customer-account-login .block-title strong,
body.customer-account-login label,
body.customer-account-login p {
    color: #ffffff !important;
}

/* Syöttökentät jätetään hieman vaaleammiksi */
body.customer-account-login input.input-text {
    background: #1a1a1a !important;
    color: #ffffff !important;
    border: 1px solid #2a2a2a !important;
}

/* Aktiivinen kenttä Rankat Ankat -punaisella */
body.customer-account-login input.input-text:focus {
    border-color: var(--ra-primary) !important;
    box-shadow: 0 0 0 1px var(--ra-primary) !important;
}


/* =========================================================
   Checkout - dark theme fixes
   ========================================================= */

.checkout-index-index,
.checkout-index-index .page-wrapper,
.checkout-index-index .page-main,
.checkout-index-index .columns,
.checkout-index-index .column.main,
.checkout-index-index .opc-wrapper,
.checkout-index-index .opc-sidebar,
.checkout-index-index .opc-summary-wrapper,
.checkout-index-index .checkout-container,
.checkout-index-index .checkout-shipping-address,
.checkout-index-index .checkout-shipping-method,
.checkout-index-index .checkout-payment-method {
    background: #000000 !important;
    color: var(--ra-text) !important;
}

/* Checkoutin osiot ja kortit */
.checkout-index-index .step-content,
.checkout-index-index .shipping-address-item,
.checkout-index-index .payment-method,
.checkout-index-index .payment-method-content,
.checkout-index-index .payment-method-title,
.checkout-index-index .opc-block-summary,
.checkout-index-index .opc-block-shipping-information,
.checkout-index-index .table-checkout-shipping-method,
.checkout-index-index .table-checkout-shipping-method tbody,
.checkout-index-index .table-checkout-shipping-method tr,
.checkout-index-index .table-checkout-shipping-method td,
.checkout-index-index .table-checkout-shipping-method th {
    background: #000000 !important;
    color: var(--ra-text) !important;
    border-color: var(--ra-border) !important;
}

/* Otsikot ja kenttien nimet */
.checkout-index-index .step-title,
.checkout-index-index .opc-block-summary > .title,
.checkout-index-index .opc-block-shipping-information .shipping-information-title,
.checkout-index-index label,
.checkout-index-index legend,
.checkout-index-index .label,
.checkout-index-index .title {
    color: #ffffff !important;
}

/* Syöttökentät */
.checkout-index-index input.input-text,
.checkout-index-index select,
.checkout-index-index textarea {
    background: #1a1a1a !important;
    color: #ffffff !important;
    border: 1px solid #2a2a2a !important;
}

/* Select-optionit */
.checkout-index-index select option {
    background: #1a1a1a !important;
    color: #ffffff !important;
}

/* Fokus */
.checkout-index-index input.input-text:focus,
.checkout-index-index select:focus,
.checkout-index-index textarea:focus {
    border-color: var(--ra-primary) !important;
    box-shadow: 0 0 0 1px var(--ra-primary) !important;
}

/* Tilauksen yhteenveto */
.checkout-index-index .opc-block-summary,
.checkout-index-index .opc-block-summary .product-item,
.checkout-index-index .opc-block-summary .product-item-details,
.checkout-index-index .opc-block-summary .table-totals,
.checkout-index-index .opc-block-summary .table-totals tbody,
.checkout-index-index .opc-block-summary .table-totals tr,
.checkout-index-index .opc-block-summary .table-totals td,
.checkout-index-index .opc-block-summary .table-totals th {
    background: #000000 !important;
    color: var(--ra-text) !important;
    border-color: var(--ra-border) !important;
}

/* Toimitustavat */
.checkout-index-index .table-checkout-shipping-method {
    background: #000000 !important;
}

.checkout-index-index .table-checkout-shipping-method td {
    color: #ffffff !important;
}

/* Maksutavat */
.checkout-index-index .payment-method {
    border-color: var(--ra-border) !important;
}

.checkout-index-index .payment-method-title {
    border-color: var(--ra-border) !important;
}

/* Linkit */
.checkout-index-index a {
    color: var(--ra-primary) !important;
}

.checkout-index-index a:hover {
    color: var(--ra-primary-hover) !important;
}

/* Sivupalkin tekstit */
.checkout-index-index .opc-block-summary span,
.checkout-index-index .opc-block-summary strong,
.checkout-index-index .opc-block-shipping-information span,
.checkout-index-index .opc-block-shipping-information strong {
    color: var(--ra-text) !important;
}

/* Magento popup/modal checkoutissa */
.checkout-index-index .modal-inner-wrap,
.checkout-index-index .modal-content,
.checkout-index-index .modal-header,
.checkout-index-index .modal-footer {
    background: #000000 !important;
    color: #ffffff !important;
}

/* Tooltipit */
.checkout-index-index .field-tooltip .field-tooltip-content {
    background: #1a1a1a !important;
    color: #ffffff !important;
    border-color: var(--ra-border) !important;
}

/* Virheet ja validation */
.checkout-index-index .mage-error {
    color: #ff6b6b !important;
}

/* Checkbox/radio labelit */
.checkout-index-index input[type="checkbox"] + label,
.checkout-index-index input[type="radio"] + label {
    color: #ffffff !important;
}



/* =========================================================
   Wishlist - dark theme fixes
   ========================================================= */

.wishlist-index-index,
.wishlist-index-index .page-wrapper,
.wishlist-index-index .page-main,
.wishlist-index-index .columns,
.wishlist-index-index .column.main,
.wishlist-index-index .form-wishlist-items,
.wishlist-index-index .products-grid,
.wishlist-index-index .product-items,
.wishlist-index-index .product-item,
.wishlist-index-index .product-item-info,
.wishlist-index-index .product-item-details,
.wishlist-index-index .fieldset,
.wishlist-index-index .field,
.wishlist-index-index .control,
.wishlist-index-index .actions-toolbar {
    background: #000000 !important;
    color: var(--ra-text) !important;
    border-color: var(--ra-border) !important;
}

/* Valkoiset reunat pois */
.wishlist-index-index .product-item-info,
.wishlist-index-index .product-item,
.wishlist-index-index .products-grid .product-item,
.wishlist-index-index .table,
.wishlist-index-index .data.table,
.wishlist-index-index td,
.wishlist-index-index th {
    border-color: var(--ra-border) !important;
    box-shadow: none !important;
}

/* Tuotteen nimet ja tekstit */
.wishlist-index-index .product-item-name,
.wishlist-index-index .product-item-name a,
.wishlist-index-index .price,
.wishlist-index-index .price-box,
.wishlist-index-index label,
.wishlist-index-index .page-title,
.wishlist-index-index .legend {
    color: #ffffff !important;
}

/* Tekstikentät */
.wishlist-index-index input.input-text,
.wishlist-index-index textarea {
    background: #1a1a1a !important;
    color: #ffffff !important;
    border: 1px solid var(--ra-border) !important;
}

/* Fokus */
.wishlist-index-index input.input-text:focus,
.wishlist-index-index textarea:focus {
    border-color: var(--ra-primary) !important;
    box-shadow: 0 0 0 1px var(--ra-primary) !important;
}

/* Wishlist-toimintopainikkeet */
.wishlist-index-index .action,
.wishlist-index-index .action.edit,
.wishlist-index-index .action.delete,
.wishlist-index-index .action.tocart {
    color: var(--ra-primary) !important;
}

/* Jos tuotekortissa on valkoinen tausta hoverissa */
.wishlist-index-index .product-item-info:hover,
.wishlist-index-index .product-item-info.active {
    background: #000000 !important;
    box-shadow: none !important;
}


/* =========================================================
   Header customer dropdown / popup - dark theme
   ========================================================= */

/* Käyttäjävalikko ja dropdownit */
.page-header .customer-menu,
.page-header .customer-menu .header.links,
.page-header .customer-menu .header.links li,
.page-header .customer-menu .header.links ul,
.page-header .dropdown,
.page-header .dropdown-menu,
.page-header .ui-dialog,
.page-header .ui-dialog-content,
.page-header .mage-dropdown-dialog,
.page-header .block,
.page-header .block-content {
    background: #000000 !important;
    color: #ffffff !important;
    border-color: var(--ra-border) !important;
}

/* Popupin otsikot ja normaalit tekstit */
.page-header .customer-menu span,
.page-header .customer-menu p,
.page-header .customer-menu strong,
.page-header .customer-menu label,
.page-header .dropdown span,
.page-header .dropdown p,
.page-header .dropdown strong,
.page-header .mage-dropdown-dialog span,
.page-header .mage-dropdown-dialog p,
.page-header .mage-dropdown-dialog strong {
    color: #ffffff !important;
}

/* Linkit */
.page-header .customer-menu a,
.page-header .dropdown a,
.page-header .mage-dropdown-dialog a {
    color: var(--ra-primary) !important;
}

.page-header .customer-menu a:hover,
.page-header .dropdown a:hover,
.page-header .mage-dropdown-dialog a:hover {
    color: var(--ra-primary-hover) !important;
}

/* Jos kirjautuminen avautuu modal-ikkunaan */
.modal-popup .modal-inner-wrap,
.modal-popup .modal-header,
.modal-popup .modal-content,
.modal-popup .modal-footer,
.modal-slide .modal-inner-wrap,
.modal-slide .modal-header,
.modal-slide .modal-content,
.modal-slide .modal-footer {
    background: #000000 !important;
    color: #ffffff !important;
    border-color: var(--ra-border) !important;
}

/* Modalin otsikot ja tekstit */
.modal-popup .modal-title,
.modal-popup label,
.modal-popup legend,
.modal-popup p,
.modal-popup span,
.modal-popup strong,
.modal-slide .modal-title,
.modal-slide label,
.modal-slide legend,
.modal-slide p,
.modal-slide span,
.modal-slide strong {
    color: #ffffff !important;
}

/* Kirjautumisen input-kentät */
.modal-popup input.input-text,
.modal-slide input.input-text,
.page-header .customer-menu input.input-text,
.page-header .mage-dropdown-dialog input.input-text {
    background: #1a1a1a !important;
    color: #ffffff !important;
    border: 1px solid var(--ra-border) !important;
}

/* Aktiivinen input */
.modal-popup input.input-text:focus,
.modal-slide input.input-text:focus,
.page-header .customer-menu input.input-text:focus {
    border-color: var(--ra-primary) !important;
    box-shadow: 0 0 0 1px var(--ra-primary) !important;
}

/* Valkoiset reunat ja varjot pois */
.page-header .customer-menu,
.page-header .dropdown-menu,
.page-header .mage-dropdown-dialog,
.modal-popup .modal-inner-wrap,
.modal-slide .modal-inner-wrap {
    border: 1px solid var(--ra-border) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.7) !important;
}

/* Popupin nuoli, jos sellainen on */
.page-header .customer-menu:before,
.page-header .customer-menu:after,
.page-header .mage-dropdown-dialog:before,
.page-header .mage-dropdown-dialog:after {
    border-bottom-color: #000000 !important;
}