/* =====================================================
   ROAMIO - MOBILE PAGE SAFETY / TYPOGRAPHY
===================================================== */

@media (max-width: 768px) {
  html,
  body,
  .site,
  .site-content,
  .content-area,
  .entry-content,
  .wp-site-blocks,
  .wp-block-group,
  .kt-row-column-wrap {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  p,
  li {
    overflow-wrap: break-word;
    word-break: normal;
  }

  .entry-content h1,
  .entry-content h2,
  .entry-content h3,
  .wp-block-heading {
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
  }
}


/* =====================================================
   ROAMIO - PRODUCT TITLE
===================================================== */

.single-product .wp-block-post-title {
  text-transform: none !important;
}


/* =====================================================
   ROAMIO - LEFT FLAG CARD ICON LIST
===================================================== */

.kt-svg-icon-list-items3177_f5fed3-de .kt-svg-icon-list-text {
  font-size: 18px !important;
  line-height: 1.2 !important;
  font-weight: 500 !important;
}

.kt-svg-icon-list-items3177_f5fed3-de .kt-svg-icon-list-item-wrap {
  margin-bottom: 6px !important;
}

.kt-svg-icon-list-items3177_f5fed3-de .kt-svg-icon-list-single {
  font-size: 15px !important;
  margin-right: 8px !important;
}


/* =====================================================
   ROAMIO - HIDE WOOCOMMERCE DUPLICATES
===================================================== */

.single-product .woocommerce-variation-price {
  display: none !important;
}

.single-product .reset_variations,
.woo-selected-variation-item-name {
  display: none !important;
}


/* =====================================================
   ROAMIO - ESIM PACKAGE SELECTOR
===================================================== */

.single-product .variations_form,
.single-product .variations,
.single-product .woo-variation-items-wrapper,
.single-product .variable-items-wrapper {
  width: 100% !important;
  max-width: 100% !important;
}

.woo-variation-swatches input[type="radio"],
.woo-variation-swatches .variable-item img {
  display: none !important;
}

.woo-variation-swatches .variable-items-wrapper {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.woo-variation-swatches .variable-items-wrapper li {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.single-product .variable-item {
  width: 100% !important;
  max-width: 100% !important;
  min-height: 56px !important;
  padding: 13px 18px !important;
  border: 1px solid #d8dee9 !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
  cursor: pointer !important;
  transition: all 0.18s ease !important;
}

.single-product .variable-item:hover {
  border-color: #5b5ce6 !important;
  box-shadow: 0 6px 18px rgba(91, 92, 230, 0.08) !important;
}

.single-product .variable-item.selected,
.single-product .radio-variable-item.selected {
  border: 2px solid #5b5ce6 !important;
  background: #fafaff !important;
  box-shadow: 0 4px 12px rgba(91, 92, 230, 0.12) !important;
}

.single-product .variable-item .variable-item-contents,
.single-product .variable-item label,
.single-product .variable-item-radio-input-wrapper,
.single-product .variable-item-radio-value-wrapper {
  width: 100% !important;
  max-width: 100% !important;
}


/* =====================================================
   ROAMIO - JS-INJECTED PACKAGE ROWS
===================================================== */

.single-product .roamio-row {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr !important;
  width: 100% !important;
  align-items: center !important;
}

.single-product .roamio-data {
  text-align: left !important;
  padding-left: 28px !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #333 !important;
}

.single-product .roamio-validity {
  text-align: center !important;
  font-size: 18px !important;
  font-weight: 500 !important;
  color: #555 !important;
}

.single-product .roamio-price {
  text-align: right !important;
  padding-right: 28px !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #1f224d !important;
}


/* =====================================================
   ROAMIO - BUY BUTTON
===================================================== */

.single-product .single_add_to_cart_button {
  width: 100% !important;
  min-height: 72px !important;
  border-radius: 16px !important;
  font-size: 22px !important;
  font-weight: 700 !important;
}


/* =====================================================
   ROAMIO - MOBILE PRODUCT SELECTOR
===================================================== */

@media (max-width: 767px) {
  .single-product .variations_form,
  .single-product .variations,
  .single-product .woo-variation-items-wrapper,
  .single-product .variable-items-wrapper,
  .single-product .variable-item,
  .single-product .variable-item-contents,
  .single-product .variable-item-radio-input-wrapper,
  .single-product .variable-item-radio-value-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .single-product .variable-items-wrapper {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  .single-product .variable-item {
    min-height: 52px !important;
    padding: 12px 10px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    border-radius: 12px !important;
  }

  .single-product .roamio-row {
    grid-template-columns: 1fr 1fr 1fr !important;
  }

  .single-product .roamio-data {
    padding-left: 10px !important;
    font-size: 20px !important;
  }

  .single-product .roamio-validity {
    font-size: 18px !important;
  }

  .single-product .roamio-price {
    padding-right: 10px !important;
    font-size: 22px !important;
  }

  .single-product .single_add_to_cart_button {
    width: calc(100% - 24px) !important;
    margin-left: 12px !important;
    margin-right: 12px !important;
    box-sizing: border-box !important;
  }
}
.single-product label[for="pa_data"] {
    display: none !important;
}
/* Produktkort - lik høyde på produkttitler */
.wc-block-product .wp-block-post-title {
    min-height: 68px !important;
    display: flex !important;
    align-items: flex-start !important;
}
/* Produktkort - hold pris/knapp likt plassert */
.wc-block-product .wp-block-woocommerce-product-price {
    margin-top: 0 !important;
}
/* Min konto - skjul WooCommerce sin standard "Logg inn"-overskrift */
body:not(.logged-in).woocommerce-account .woocommerce h2 {
    display: none !important;
}
.b2bking_b2bregistration_only_register_header {
    display: none !important;
}
/* Make the form feel more premium */
.b2bking_registration_roles_dropdown_section,
.b2bking_b2bregistration_only_register_container,
form.register {
    border-radius: 14px !important;
    box-shadow: 0 10px 30px rgba(20, 18, 70, 0.08);
}

/* Slightly reduce empty space above the form */
.woocommerce-form-register {
    margin-top: 40px !important;
}
/* Skjul registreringsvalg når bruker er innlogget */
body.logged-in .roamio-register-options {
    display: none !important;
}
.logged-in.woocommerce-account .woocommerce-MyAccount-content > p {
    display: none !important;
}
.roamio-account-dashboard h2 {
    color: #24166F;
    font-size: 36px;
    margin-bottom: 10px;
}

.roamio-account-dashboard > p {
    font-size: 17px;
    color: #555;
    margin-bottom: 28px;
}

.roamio-account-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.roamio-account-card {
    background: #F8FAFC;
    border: 1px solid #E5E7EB;
    border-radius: 16px;
    padding: 24px;
    text-decoration: none;
    color: #24166F;
    transition: all 0.2s ease;
}

.roamio-account-card:hover {
    background: #F1EEFF;
    transform: translateY(-2px);
}

.roamio-account-card-icon {
    display: block;
    font-size: 30px;
    margin-bottom: 14px;
}

.roamio-account-card strong {
    display: block;
    font-size: 18px;
    margin-bottom: 8px;
}

.roamio-account-card small {
    color: #555;
    line-height: 1.4;
}

@media (max-width: 768px) {
    .roamio-account-cards {
        grid-template-columns: 1fr;
    }
}
/* Fjern avatar på Min Konto */
.woocommerce-MyAccount-content .avatar,
.woocommerce-MyAccount-content img.avatar,
.woocommerce-MyAccount-navigation .avatar,
.woocommerce-MyAccount-navigation img.avatar,
.woocommerce-account .avatar {
    display: none !important;
}
/* Fjern standard avatarer */
.woocommerce-account .kadence-account-avatar,
.woocommerce-account .woocommerce-account-gravatar {
    display: none !important;
}
.woocommerce-MyAccount-navigation {
    padding-top: 120px;
}
/* Mine eSIM-er - tom tilstand */
.woocommerce-MyAccount-content .woocommerce-info {
    background: #F8FAFC !important;
    border: 1px solid #E5E7EB !important;
    border-left: 4px solid #3D67F2 !important;
    border-radius: 16px !important;
    padding: 24px !important;
    color: #333 !important;
}

.woocommerce-MyAccount-content .woocommerce-info .button {
    background: #3D67F2 !important;
    color: #fff !important;
    border-radius: 12px !important;
    padding: 14px 22px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}
/* Tom tilstand - Mine eSIM-er */
.woocommerce-MyAccount-content .woocommerce-info {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 20px !important;
}

/* Knappen */
.woocommerce-MyAccount-content .woocommerce-info .button {
    margin: 0 !important;
    float: none !important;
    align-self: flex-start !important;
}
.kt-blocks-info-box-title {
    min-height: 54px;
    display: flex;
    align-items: top;
    justify-content: center;
}
/* =====================================================
   ROAMIO - RESPONSIVE WORDPRESS ACCORDION
===================================================== */
/* Accordion outer structure */
.single-product .wp-block-accordion,
.single-product .wp-block-accordion-item,
.single-product .wp-block-accordion-heading,
.single-product .wp-block-accordion-panel {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Accordion heading */
.single-product .wp-block-accordion-heading {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.single-product .wp-block-accordion-heading__toggle,
.single-product .wp-block-accordion-heading__toggle:hover,
.single-product .wp-block-accordion-heading__toggle:focus {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    overflow: visible !important;
}

.single-product .wp-block-accordion-heading__toggle-title {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    white-space: normal !important;
}

.single-product .wp-block-accordion-heading__toggle-icon {
    flex: 0 0 auto !important;
    margin-left: 15px !important;
}

/* Accordion content */
.single-product .wp-block-accordion-panel.wp-block-accordion-panel {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    overflow: visible !important;
}

.single-product .wp-block-accordion-panel > * {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

@media (max-width: 1100px) {
    .single-product .wp-block-accordion-heading__toggle-title {
        font-size: clamp(28px, 3.5vw, 42px) !important;
    }
}
/* =====================================================
   ROAMIO - MIN KONTO / LOGIN PAGE
===================================================== */


/* -----------------------------------------------------
   SKJUL FIBOSEARCH PÅ MIN KONTO NÅR MAN ER LOGGET UT
----------------------------------------------------- */

body:not(.logged-in).woocommerce-account .dgwt-wcas-search-wrapp {
    display: none !important;
}


/* -----------------------------------------------------
   2. HOVEDOMRÅDE
----------------------------------------------------- */

body:not(.logged-in).woocommerce-account .woocommerce {
    width: 100% !important;
    max-width: 560px !important;
    margin: 0 auto !important;
}


/* Skjul WooCommerce sin standard "Logg inn"-overskrift */
body:not(.logged-in).woocommerce-account .woocommerce h2 {
    display: none !important;
}


/* -----------------------------------------------------
   3. LOGIN-KORT
----------------------------------------------------- */

body:not(.logged-in).woocommerce-account form.login {
    width: 100% !important;
    max-width: 520px !important;

    margin: 28px auto 0 !important;
    padding: 32px !important;

    box-sizing: border-box !important;

    background: #ffffff !important;
    border: 1px solid #E5E7EB !important;
    border-radius: 18px !important;

    box-shadow: 0 12px 35px rgba(36, 22, 111, 0.08) !important;
}


/* -----------------------------------------------------
   4. LABELS
----------------------------------------------------- */

body:not(.logged-in).woocommerce-account form.login label {
    display: block !important;

    margin-bottom: 7px !important;

    color: #292929 !important;

    font-size: 15px !important;
    font-weight: 600 !important;
}


/* -----------------------------------------------------
   5. INPUTFELT
----------------------------------------------------- */

body:not(.logged-in).woocommerce-account form.login input[type="text"],
body:not(.logged-in).woocommerce-account form.login input[type="email"],
body:not(.logged-in).woocommerce-account form.login input[type="password"] {
    width: 100% !important;
    min-height: 54px !important;

    padding: 12px 16px !important;

    box-sizing: border-box !important;

    background: #FAFBFC !important;

    border: 1px solid #D8DEE9 !important;
    border-radius: 12px !important;

    box-shadow: none !important;

    color: #222 !important;

    font-size: 16px !important;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        background 0.2s ease !important;
}


/* Fokus på input */
body:not(.logged-in).woocommerce-account form.login input[type="text"]:focus,
body:not(.logged-in).woocommerce-account form.login input[type="email"]:focus,
body:not(.logged-in).woocommerce-account form.login input[type="password"]:focus {
    outline: none !important;

    background: #ffffff !important;

    border-color: #3D67F2 !important;

    box-shadow: 0 0 0 3px rgba(61, 103, 242, 0.10) !important;
}


/* -----------------------------------------------------
   6. AVSTAND MELLOM FELTENE
----------------------------------------------------- */

body:not(.logged-in).woocommerce-account form.login .form-row {
    margin-bottom: 18px !important;
}


/* -----------------------------------------------------
   7. HUSK MEG
----------------------------------------------------- */

body:not(.logged-in).woocommerce-account form.login .woocommerce-form-login__rememberme {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;

    margin: 2px 0 14px !important;

    font-size: 14px !important;
    font-weight: 500 !important;
}


/* Checkbox */
body:not(.logged-in).woocommerce-account form.login input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;

    margin: 0 !important;

    cursor: pointer !important;
}


/* -----------------------------------------------------
   8. LOGG INN-KNAPP
----------------------------------------------------- */

body:not(.logged-in).woocommerce-account form.login button[type="submit"] {
    width: 100% !important;
    min-height: 54px !important;

    margin: 4px 0 0 !important;
    padding: 14px 20px !important;

    float: none !important;

    background: #3D67F2 !important;
    color: #ffffff !important;

    border: none !important;
    border-radius: 12px !important;

    font-size: 17px !important;
    font-weight: 700 !important;

    text-align: center !important;

    cursor: pointer !important;

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        background 0.2s ease !important;
}


/* Hover */
body:not(.logged-in).woocommerce-account form.login button[type="submit"]:hover {
    background: #3158DE !important;

    transform: translateY(-1px) !important;

    box-shadow: 0 7px 18px rgba(61, 103, 242, 0.20) !important;
}


/* -----------------------------------------------------
   9. MISTET PASSORDET
----------------------------------------------------- */

body:not(.logged-in).woocommerce-account .woocommerce-LostPassword {
    margin: 18px 0 0 !important;

    text-align: center !important;
}


body:not(.logged-in).woocommerce-account .woocommerce-LostPassword a {
    color: #3D67F2 !important;

    font-size: 15px !important;
    font-weight: 500 !important;

    text-decoration: none !important;
}


body:not(.logged-in).woocommerce-account .woocommerce-LostPassword a:hover {
    text-decoration: underline !important;
}


/* -----------------------------------------------------
   10. PASSWORD-EYE / SHOW PASSWORD
----------------------------------------------------- */

body:not(.logged-in).woocommerce-account form.login .password-input {
    width: 100% !important;
}


body:not(.logged-in).woocommerce-account form.login .show-password-input {
    right: 16px !important;
}


/* -----------------------------------------------------
   11. MOBIL
----------------------------------------------------- */

@media (max-width: 600px) {

    body:not(.logged-in).woocommerce-account .woocommerce {
        max-width: 100% !important;

        padding-left: 16px !important;
        padding-right: 16px !important;

        box-sizing: border-box !important;
    }


    body:not(.logged-in).woocommerce-account form.login {
        width: 100% !important;

        margin-top: 20px !important;

        padding: 24px 20px !important;

        border-radius: 16px !important;
    }


    body:not(.logged-in).woocommerce-account form.login input[type="text"],
    body:not(.logged-in).woocommerce-account form.login input[type="email"],
    body:not(.logged-in).woocommerce-account form.login input[type="password"] {
        min-height: 52px !important;
    }


    body:not(.logged-in).woocommerce-account form.login button[type="submit"] {
        min-height: 52px !important;
    }

}