.attv {
    /* Farger/typografi arves fra css/attvin.css. Her kun lokale alias. */
    --card: #ffffff;
    --border: var(--line);
    --shadow: var(--shadow-lg);
    --shadow2: var(--shadow-sm);
    --primary2: var(--attvin-blue-hover);
    --radius: 18px;
    --radius2: 14px;
    /* Rimelige overskriftsstørrelser i skjema-kontekst */
    --fs-h2: 1.75rem;
    --fs-h3: 1.375rem;
    --fs-h4: 1.125rem;
    --fs-h5: 1.0625rem;
    --fs-h6: 1rem;
    --fs-p: 1.0625rem;

    font-family: var(--font-sans);
    font-size: 16px;
    font-weight: var(--w-regular);
    color: var(--ink);
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
    align-items: flex-start;
    overflow-x: clip;
  }

  .attv-main { display: flex; flex-direction: column; gap: 14px; }


  .attv-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow2);
    padding: 18px 18px 16px;
  }

  .attv-step-head { display:flex; justify-content: space-between; gap: 10px; }
  .attv-step-head-row{ align-items:flex-start; }
  .attv-step-head-right{ display:flex; align-items:center; }

  .attv-subhead-row{
    display:flex;
    justify-content: space-between;
    align-items:flex-start;
    gap: 12px;
  }

  .attv-vat-mini{
    display:flex;
    align-items:center;
    gap: 6px;
    font-size: 12px;
    color: var(--muted);
    font-weight: 600;
    user-select: none;
    white-space: nowrap;
  }
  .attv-vat-mini input{
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
  }
  .attv-switch{
    width: 36px;
    height: 20px;
    border-radius: 999px;
    background: #cbd5e1;
    position: relative;
    transition: background 0.2s ease;
    box-shadow: inset 0 0 0 1px rgba(15,23,42,0.08);
    flex: 0 0 auto;
  }
  .attv-switch::after{
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    border-radius: 999px;
    background: #fff;
    transition: transform 0.2s ease;
    box-shadow: 0 2px 6px rgba(15,23,42,0.2);
  }
  .attv-vat-mini input:checked + .attv-switch{
    background: var(--primary);
  }
  .attv-vat-mini input:checked + .attv-switch::after{
    transform: translateX(16px);
  }
  .attv-vat-mini input:disabled + .attv-switch{
    opacity: 0.6;
  }
  .attv-switch-label{
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
  }

  .attv-step { display: none; }
  .attv-step.is-active { display: block; }

  .attv-step h2 {
    margin:0; font-family: var(--font-sans); font-weight: 800;
    font-size: var(--fs-h2); line-height: 1.15; letter-spacing: -0.01em;
    color: var(--attvin-blue-dark);
  }
  .attv-step p { margin: 6px 0 0; color: var(--muted); font-size: var(--fs-p); line-height: 1.5; }

  .attv-row { display:flex; gap: 12px; margin-top: 12px; align-items: stretch; }
  .attv-address-row{ align-items: flex-start; }
  @media (max-width: 640px) { .attv-row { flex-direction: column; } }

  .attv-step-actions{
    margin-top: 14px;
    display:flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
  }
  .attv-step-actions .attv-btn-primary{ margin-left: auto; }
  .attv-step-actions .attv-btn-ghost{ border-radius: 14px; }

  .attv-callout{
    border: 1px solid var(--attvin-blue-light);
    background: var(--attvin-blue-tint);
    border-radius: 14px;
    padding: 12px 14px;
    font-size: 15px;
    color: var(--attvin-blue-dark);
    margin-bottom: 12px;
  }
  .attv-callout-title{
    font-weight: 700;
    color: var(--attvin-blue-dark);
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 12px;
  }

  .attv-choice.attv-choice-compact .attv-choice-title{
    font-size: 1.1em;
  }
  .attv-choice.attv-choice-compact .attv-choice-sub{
    font-size: 0.95em;
    line-height: 1.4;
  }

  .attv-field { display:flex; flex-direction: column; gap: 6px; flex: 1; }
  .attv-field label { font-size: 14px; color: var(--attvin-blue-dark); font-weight: 600; }

  .attv-input, .attv-select {
    width: 100%;
    border: 1px solid #d0d5dd;
    background: #fff;
    color: var(--ink);
    border-radius: 12px;
    padding: 11px 14px;
    outline: none;
    transition: box-shadow .15s ease, border-color .15s ease, transform .08s ease;
    font-size: 16px;
    height: 46px;
    font-family: var(--font-sans);
  }
  .attv-input::placeholder { color: #98a2b3; }
  .attv-input:hover, .attv-select:hover { border-color: #98a2b3; }
  .attv-input:focus, .attv-select:focus {
    border-color: var(--attvin-blue-medium);
    box-shadow: var(--focus-ring);
    background: #fff;
  }

  .attv-address-field{
    position: relative;
  }
  .attv-address-input-wrap{
    position: relative;
    border: 1px solid #d0d5dd;
    border-radius: 14px;
    background: #fff;
    box-shadow: none;
    transition: border-color .15s ease, box-shadow .15s ease;
  }
  .attv-address-input-wrap:hover{
    border-color: #98a2b3;
    box-shadow: 0 0 0 2px rgba(16,24,40,0.04);
  }
  .attv-address-input-wrap > i{
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #0065C1;
    font-size: 18px;
    pointer-events: none;
    transition: color .15s ease;
  }
  .attv-input.attv-input-address{
    border: none;
    box-shadow: none;
    background: #fff;
    height: 44px;
    padding-left: 40px;
    padding-right: 44px;
    border-radius: 14px;
    font-size: 16px;
  }
  .attv-input.attv-input-address:focus{
    border: none;
    box-shadow: 0 0 0 3px rgba(0,101,193,0.15);
    background: #fff;
  }
  .attv-address-clear{
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    border-radius: 999px;
    border: 1px solid #d0d5dd;
    background: #fff;
    color: #475467;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease, color .15s ease;
  }
  .attv-address-clear:hover{
    border-color: #98a2b3;
    background: #f8fafc;
    color: #101828;
  }
  .attv-address-field.is-loading .attv-address-input-wrap{
    border-color: #6BB8FF;
    box-shadow: 0 0 0 3px rgba(0,101,193,0.12);
  }

  .attv-hint { font-size: 16px; color: var(--muted); }
  .attv-hint.is-loading{
    color: #0065C1;
  }
  .attv-hint.is-success{
    color: #067647;
  }
  .attv-error { font-size: 15px; color: #dc2626; min-height: 16px; margin-top: 4px; line-height: 1.35; }
  .attv-error strong{ display:block; font-size: 15px; }
  .attv-error-hint{
    display:block;
    margin-top: 2px;
    color: #b42318;
    opacity: 0.92;
    font-size: 14px;
  }

  .attv-btn {
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 10px 14px;
    cursor: pointer;
    font-weight: 800;
    letter-spacing: 0.2px;
    font-size: 16px;
    transition: transform .08s ease, box-shadow .15s ease, background-color .15s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    user-select: none;
  }
  .attv-btn:active { transform: translateY(1px); }
  .attv-btn-primary {
    background: var(--primary);
    color: #fff;
    box-shadow: 0 12px 22px rgba(0,101,193,0.18);
  }
  .attv-btn-primary:hover { background: var(--primary2); box-shadow: 0 14px 26px rgba(0,101,193,0.22); }
  .attv-btn[disabled] { opacity: .55; cursor: not-allowed; box-shadow: none; }

  .attv-btn-block { width: 100%; border-radius: 14px; padding: 12px 14px; }
  .attv-btn-address{ height: 42px; min-width: 160px; }

  .attv-btn-spinner {
    display:none; width: 14px; height: 14px;
    border-radius: 999px; border: 2px solid rgba(255,255,255,.8);
    border-top-color: transparent;
    animation: attvSpin .8s linear infinite;
  }
  .attv-btn.is-loading .attv-btn-spinner { display:inline-block; }
  @keyframes attvSpin { to { transform: rotate(360deg); } }

  .attv-link{
    border: none;
    background: transparent;
    color: #0065C1;
    font-weight: 800;
    font-size: 16px;
    cursor: pointer;
    padding: 8px 10px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
  }
  .attv-link:hover{
    background: #CCE0F3;
    color: #0065C1;
  }
  .attv-link:disabled{
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;
  }
  .attv-link-danger{
    color: #b42318;
  }
  .attv-link-danger:hover{
    background: #fee4e2;
    color: #b42318;
  }
  .attv-link:focus-visible{
    outline: 2px solid #6BB8FF;
    outline-offset: 2px;
  }

  .attv-btn-ghost{
    border: 1px solid var(--border);
    background: #fff;
    color: var(--ink);
    box-shadow: none;
  }
  .attv-btn-ghost:hover{
    border-color: #CCE0F3;
    background: #fbfdff;
  }

  .attv-choice-grid {
    display:grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 10px;
    margin-top: 12px;
  }
  @media (max-width: 640px) { .attv-choice-grid { grid-template-columns: 1fr; } }

  .attv-choice {
    border: 1px solid var(--border);
    border-radius: var(--radius2);
    background: #fff;
    padding: 14px;
    text-align: left;
    cursor: pointer;
    transition: box-shadow .15s ease, transform .08s ease, border-color .15s ease, background-color .15s ease;
  }
  .attv-choice:hover { border-color: #CCE0F3; box-shadow: 0 12px 22px rgba(15,23,42,0.08); transform: translateY(-1px); background: #fbfdff; }
  .attv-choice.is-selected { border-color: #6BB8FF; box-shadow: 0 0 0 4px rgba(0,101,193,0.10), 0 12px 22px rgba(15,23,42,0.08); }
  .attv-choice-title { font-size: var(--fs-h3); font-weight: 800; }
  .attv-choice-sub { font-size: 1em; color: var(--muted); margin-top: 4px; line-height: 1.55; }
  .attv-customer-top{
    display:flex;
    align-items:center;
    gap: 10px;
  }
  .attv-customer-icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size: 22px;
    line-height: 1;
    flex: 0 0 auto;
  }
  .attv-choice.attv-customer-choice{
    border-width: 2px;
    color: var(--ink);
  }
  .attv-choice.attv-customer-private{
    border-color: #DED8F0;
    background: #DED8F0;
  }
  .attv-choice.attv-customer-private .attv-choice-title,
  .attv-choice.attv-customer-private .attv-customer-icon{
    color: #2f2452;
  }
  .attv-choice.attv-customer-private .attv-choice-sub{
    color: #4d3f77;
  }
  .attv-choice.attv-customer-private:hover{
    border-color: #c4b7e6;
    box-shadow: 0 12px 22px rgba(92,60,181,0.16);
    background: #d6cdea;
  }
  .attv-choice.attv-customer-private.is-selected{
    border-color: #7c66b0;
    box-shadow: 0 0 0 4px rgba(124,102,176,0.28), 0 12px 22px rgba(92,60,181,0.22);
    background: #DED8F0;
  }

  .attv-choice.attv-customer-business{
    border-color: #CCE0F3;
    background: #CCE0F3;
  }
  .attv-choice.attv-customer-business .attv-choice-title,
  .attv-choice.attv-customer-business .attv-customer-icon{
    color: #003a70;
  }
  .attv-choice.attv-customer-business .attv-choice-sub{
    color: #24527c;
  }
  .attv-choice.attv-customer-business:hover{
    border-color: #a9cae7;
    box-shadow: 0 12px 22px rgba(0,101,193,0.16);
    background: #c4dbf0;
  }
  .attv-choice.attv-customer-business.is-selected{
    border-color: #2f6ea8;
    box-shadow: 0 0 0 4px rgba(47,110,168,0.25), 0 12px 22px rgba(0,101,193,0.18);
    background: #CCE0F3;
  }
  .attv-choice-media{
    height: 150px;
    border-radius: 14px;
    border: none;
    background: var(--attvin-blue-tint);
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom: 8px;
    overflow:hidden;
  }
  .attv-choice-media img{ width:100%; height:100%; object-fit: contain; display:block; }
  .attv-flow-shell{
    background: transparent;
    border: none;
    box-shadow: none;
    margin-top: 0;
    padding: 0;
  }
  .attv-flow-grid{
    margin-top: 10px;
  }
  .attv-flow-choice{
    display:flex;
    flex-direction: column;
    gap: 8px;
    border-radius: 16px;
    border-width: 2px;
    position: relative;
  }
  .attv-flow-choice:hover{
    border-color: #b7d7ef;
  }
  .attv-flow-choice.is-selected{
    border-color: #2f6ea8;
    box-shadow: 0 0 0 4px rgba(47,110,168,0.16), 0 12px 22px rgba(15,23,42,0.08);
  }
  .attv-flow-choice.is-selected::after{
    content: "Valgt";
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 12px;
    font-weight: 800;
    color: #0b1220;
    background: #dff3e7;
    border: 1px solid #86efac;
    border-radius: 999px;
    padding: 3px 8px;
  }
  .attv-flow-choice .attv-choice-media{
    height: 124px;
    margin-bottom: 2px;
    background: var(--attvin-blue-tint);
  }
  .attv-flow-choice .attv-choice-title{
    font-size: 1.35em;
    line-height: 1.25;
  }
  .attv-flow-choice .attv-choice-sub{
    font-size: 0.98em;
  }
  .attv-flow-chip{
    align-self: flex-start;
    display:inline-flex;
    align-items:center;
    gap: 6px;
    font-size: 12px;
    font-weight: 800;
    color: #004382;
    background: #e7f1fa;
    border: 1px solid #c7ddf2;
    border-radius: 999px;
    padding: 4px 8px;
  }
  .attv-flow-chip i{
    font-size: 14px;
    line-height: 1;
  }

  .attv-subcard {
    border: none;
    border-radius: var(--radius2);
    padding: 14px;
    background: #fff;
    margin-top: 12px;
  }
  /* I oppsummerings-modalen sitter subcards på hvit flate – gi dem tydelige kanter */
  .attv-modal-col .attv-subcard{
    border: 1px solid var(--line);
    background: #fff;
    box-shadow: var(--shadow-sm);
  }
  .attv-modal-col .attv-subcard .attv-subhead h3{ font-size: var(--fs-h4); }

  .attv-subhead h3 {
    margin: 0; font-family: var(--font-sans); font-weight: 800;
    font-size: var(--fs-h3); line-height: 1.2; color: var(--attvin-blue-dark);
    letter-spacing: -0.005em;
  }
  .attv-subhead p { margin: 4px 0 0; font-size: var(--fs-p); color: var(--muted); }

  .attv-grid-2 { display:grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
  @media (max-width: 640px) { .attv-grid-2 { grid-template-columns: 1fr; } }

  .attv-radio-row { display:flex; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
  .attv-radio {
    flex: 1;
    min-width: 240px;
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 12px;
    background: #fbfcfe;
    cursor: pointer;
    transition: transform .08s ease, box-shadow .15s ease, border-color .15s ease;
    display:flex;
    justify-content: space-between;
    gap: 10px;
    align-items: center;
  }
  .attv-radio:hover { transform: translateY(-1px); box-shadow: 0 12px 22px rgba(15,23,42,0.06); border-color: #CCE0F3; }
  .attv-radio.is-selected { border-color: #6BB8FF; box-shadow: 0 0 0 4px rgba(0,101,193,0.10); background: #fff; }
  .attv-radio-main{ min-width: 0; }
  .attv-radio-title{
    display:flex;
    align-items:center;
    gap: 8px;
  }
  .attv-radio-icon{
    width: 30px;
    height: 30px;
    border-radius: 10px;
    border: 1px solid #c7ddf2;
    background: #e7f1fa;
    display:flex;
    align-items:center;
    justify-content:center;
    color: #004382;
    flex: 0 0 auto;
  }
  .attv-radio-icon i{ font-size: 16px; line-height: 1; }
  .attv-radio strong { font-size: 16px; }
  .attv-radio span { display:block; font-size: 14px; color: var(--muted); margin-top: 2px; }
  .attv-radio-price{
    display:inline-flex;
    align-items:center;
    margin-top: 6px;
    font-size: 13px;
    font-weight: 800;
    color: #004382;
    background: #e7f1fa;
    border: 1px solid #c7ddf2;
    border-radius: 999px;
    padding: 2px 8px;
    width: fit-content;
  }
  .attv-radio-price.is-free{
    color: #067647;
    background: #ecfdf3;
    border-color: #abefc6;
  }
  .attv-radio-arrow{
    color: #0065C1;
    font-size: 18px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex: 0 0 auto;
  }
  .attv-empty-note{
    margin-top: 12px;
    border: 1px solid #dbe5f0;
    background: #f8fbff;
    border-radius: 14px;
    padding: 12px 14px;
    display:flex;
    align-items:flex-start;
    gap: 10px;
    box-shadow: 0 8px 18px rgba(15,23,42,0.05);
  }
  .attv-empty-note i{
    font-size: 22px;
    color: #004382;
    margin-top: 1px;
    flex: 0 0 auto;
  }
  .attv-empty-note strong{
    display:block;
    font-size: 16px;
    color: #0b1220;
  }
  .attv-empty-note span{
    display:block;
    margin-top: 2px;
    font-size: 14px;
    color: #475467;
  }
  .attv-empty-card{
    background: #fff;
    border-color: #e4e7ec;
    box-shadow: 0 10px 22px rgba(15,23,42,0.06);
  }
  .attv-empty-card .attv-product-grid{
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 12px;
    margin-top: 4px;
  }
  .attv-empty-fulfillment{
    background: #fff;
    border-color: #e4e7ec;
    box-shadow: 0 10px 22px rgba(15,23,42,0.06);
  }
  .attv-empty-fulfillment .attv-radio-row{
    display:grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 12px;
  }
  .attv-empty-fulfillment .attv-radio{
    min-width: 0;
  }
  .attv-empty-fulfillment .attv-radio-title{
    gap: 6px;
  }
  .attv-empty-fulfillment .attv-radio-icon{
    width: auto;
    height: auto;
    border: none;
    background: transparent;
    border-radius: 0;
    color: #004382;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .attv-empty-fulfillment .attv-radio-icon i{
    font-size: 20px;
    line-height: 1;
  }
  .attv-empty-fulfillment #attv-fulfillment-pickup{
    margin-top: 10px;
  }
  .attv-empty-card .attv-product{
    border-color: #e4e7ec;
    box-shadow: 0 8px 16px rgba(15,23,42,0.04);
  }
  .attv-empty-card .attv-product-media{
    height: 124px;
    background: var(--attvin-blue-tint);
  }
  .attv-empty-card .attv-product-body{
    padding: 12px 12px 14px;
  }
  .attv-empty-card .attv-product-title{
    font-size: 1.05em;
  }
  .attv-empty-card .attv-product-sub{
    font-size: 0.92em;
  }
  .attv-empty-card .attv-product-actions{
    margin-top: 12px;
    justify-content: flex-start;
  }
  .attv-empty-card .attv-qtyrow{
    border: 1px solid #d0d5dd;
    border-radius: 999px;
    padding: 4px 6px;
    background: #fff;
  }
  .attv-empty-card .attv-qtybtn{
    width: 30px;
    height: 30px;
    border-radius: 999px;
    border: none;
    background: #f2f4f7;
  }
  .attv-empty-card .attv-qtybtn:hover{
    background: #e4e7ec;
  }
  .attv-empty-card .attv-qtyval{
    min-width: 30px;
  }
  @media (max-width: 640px){
    .attv-empty-card .attv-product-grid{
      grid-template-columns: 1fr;
    }
    .attv-empty-fulfillment .attv-radio-row{
      grid-template-columns: 1fr;
    }
  }

  .attv-product-grid {
    display:grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 10px;
    margin-top: 12px;
  }
  @media (max-width: 520px) { .attv-product-grid { grid-template-columns: 1fr; } }

  .attv-product {
    border: 1px solid var(--border);
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    transition: transform .08s ease, box-shadow .15s ease, border-color .15s ease;
  }
  .attv-product:hover { transform: translateY(-1px); box-shadow: 0 12px 22px rgba(15,23,42,0.08); border-color: #CCE0F3; }
  .attv-product-media {
    height: 110px;
    position: relative;
    background: var(--attvin-blue-tint);
    display:flex;
    align-items:center;
    justify-content:center;
    border-bottom: 1px solid var(--border);
  }
  .attv-product-media img { width: 100%; height: 92px; object-fit: contain; display:block; }
  .attv-product-body { padding: 12px; }
  .attv-product-title { font-weight: 800; font-size: 1.125em; }
  .attv-product-sub { color: var(--muted); font-size: 1em; margin-top: 3px; }
  .attv-product-actions { display:flex; gap: 10px; align-items:center; margin-top: 10px; justify-content: space-between; }

  .attv-qtyrow { display:flex; align-items:center; gap: 8px; }
  .attv-qtybtn {
    width: 36px;
    height: 36px;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: #fff;
    cursor: pointer;
    font-weight: 800;
  }
  .attv-qtybtn:hover { border-color: #CCE0F3; background: #fbfdff; }
  .attv-qtyval { min-width: 36px; text-align: center; font-weight: 800; font-size: 16px; }

  .attv-inline-note {
    margin-top: 12px;
    font-size: 16px;
    color: #0065C1;
    background: #CCE0F3;
    border: 1px solid #CCE0F3;
    border-radius: 14px;
    padding: 10px 12px;
  }

  .attv-pick-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px;
    margin-top: 12px;
  }
  @media (max-width: 520px) { .attv-pick-grid { grid-template-columns: 1fr; } }

  .attv-pick-grid-2col{ grid-template-columns: 1fr; }

  .attv-pick-card {
    border: 1px solid var(--border);
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
    cursor: pointer;
    transition: box-shadow .15s ease, border-color .15s ease;
  }
  .attv-pick-card:hover { box-shadow: 0 6px 14px rgba(15,23,42,0.06); border-color: #CCE0F3; }
  .attv-pick-card.is-selected { border-color: #6BB8FF; box-shadow: 0 0 0 3px rgba(0,101,193,0.10); }

  .attv-pick-media {
    height: 84px;
    background: #f7fbff;
    border-bottom: 1px solid var(--border);
    display:flex; align-items:center; justify-content:center;
  }
  .attv-pick-media img { height:100%; object-fit: contain; display:block; }
  .attv-pick-body { padding: 10px 12px; }
  .attv-pick-title { font-weight: 800; font-size: 1.125em; }
  .attv-pick-sub { color: var(--muted); font-size: 1em; margin-top: 3px; }

  /* Waste cards */
  .attv-pick-card.attv-waste-card{
    display:flex; flex-direction: row; align-items: stretch;
    gap: 10px; padding: 10px; overflow: visible;
  }
  .attv-pick-card.attv-waste-card .attv-pick-media{
    width: 64px; height: 64px;
    border-radius: 12px;
    border: 1px solid var(--border);
    overflow:hidden;
    flex: 0 0 auto;
    background: #f7fbff;
  }
  .attv-pick-card.attv-waste-card .attv-pick-media img{
    width: 100%; height: 100%;
    display:block; object-fit: cover;
  }
  .attv-waste-body{ min-width: 0; flex: 1; display:flex; flex-direction: column; gap: 4px; }
  .attv-waste-title{ font-weight: 800; font-size: 1.0625em; }
  .attv-waste-meta-row{
    display:flex;
    align-items:center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
  }
  .attv-waste-price{
    font-size: 16px;
    font-weight: 800;
    color: #0065C1;
  }
  .attv-waste-qty{
    font-size: 14px;
    color: var(--muted);
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    padding: 3px 8px;
  }

  .attv-waste-controls{
    display:flex; align-items:center; justify-content: space-between;
    gap: 8px; margin-top: 4px;
  }

  .attv-waste-toggle{
    border: 1px solid var(--border);
    background: #fff;
    border-radius: 999px;
    padding: 6px 10px;
    cursor: pointer;
    font-size: 16px;
    font-weight: 800;
    white-space: nowrap;
  }
  .attv-waste-toggle:hover{ border-color:#CCE0F3; background:#fbfdff; }

  .attv-upsell { background: var(--attvin-blue-tint); }
  .attv-upsell-grid{
    display:grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 10px;
    margin-top: 12px;
  }
  @media (max-width: 980px){ .attv-upsell-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
  @media (max-width: 520px){ .attv-upsell-grid{ grid-template-columns: 1fr; } }
  .attv-upsell-card{
    border: 1px solid #CCE0F3;
    border-radius: 16px;
    background: #fff;
    padding: 12px;
    display:flex;
    flex-direction: column;
    gap: 8px;
    transition: transform .08s ease, box-shadow .15s ease, border-color .15s ease;
  }
  .attv-upsell-card:hover{
    transform: translateY(-1px);
    box-shadow: 0 12px 20px rgba(15,23,42,0.08);
    border-color: #6BB8FF;
  }
  .attv-upsell-media{
    height: 90px;
    position: relative;
    border-radius: 14px;
    border: 1px solid #CCE0F3;
    background: var(--attvin-blue-tint);
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
  }
  .attv-upsell-media img{ width:100%; height:100%; object-fit: contain; display:block; }
  .attv-upsell-card .attv-qtyrow{
    width: 100%;
    justify-content: center;
  }
  .attv-upsell-title{ font-weight: 800; font-size: 1.125em; }
  .attv-upsell-price{
    display:flex;
    align-items:center;
    gap: 8px;
    flex-wrap: wrap;
  }
  .attv-upsell-badge{
    background: #0065C1;
    color: #fff;
    font-size: 16px;
    font-weight: 800;
    padding: 6px 10px;
    border-radius: 999px;
  }
  .attv-upsell-old{ text-decoration: line-through; color: var(--muted); font-size: 1em; }
  .attv-upsell-new{ font-size: 1.125em; font-weight: 800; color: #0065C1; }
  .attv-upsell-add{ width: 100%; }

  .attv-pick-add{
    margin-top: 10px;
    display:flex;
    align-items:center;
    gap: 12px;
    flex-wrap: wrap;
  }
  .attv-pick-wizard{
    margin-top: 12px;
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 12px;
    background: #fcfdff;
  }
  .attv-pick-wizard-step{ display:block; }
  .attv-wizard-head{
    display:flex;
    align-items:center;
    justify-content: space-between;
    font-weight: 800;
    font-size: 16px;
    margin-bottom: 8px;
    margin-top: 15px;
  }
  .attv-wizard-back{ font-weight: 700; }
  .attv-wizard-actions{
    margin-top: 12px;
    display:flex;
    align-items:center;
    justify-content: space-between;
    gap: 10px;
  }
  .attv-wizard-actions .attv-btn-primary{ margin-left: auto; }

  .attv-pick-info{
    margin-top: 10px;
    border: 1px solid #93c5fd;
    background: #eff6ff;
    border-radius: 14px;
    padding: 10px 12px;
    display:flex;
    gap: 10px;
    align-items:flex-start;
  }
  .attv-pick-info i{
    font-size: 20px;
    color: #1d4ed8;
    margin-top: 1px;
    flex: 0 0 auto;
  }
  .attv-pick-info strong{
    display:block;
    font-size: 16px;
  }
  .attv-pick-info span{
    display:block;
    margin-top: 2px;
    font-size: 14px;
    color: #1e3a8a;
  }

  .attv-pick-add-card{
    margin-top: 10px;
    width: 100%;
    border: 1px solid #d0d5dd;
    background: #fff;
    border-radius: 16px;
    padding: 14px 16px;
    display:flex;
    justify-content:center;
    align-items:center;
    gap: 10px;
    cursor: pointer;
    font-size: 1.125em;
    font-weight: 800;
    transition: transform .08s ease, box-shadow .15s ease, border-color .15s ease;
  }
  .attv-pick-add-card:hover{
    transform: translateY(-1px);
    border-color: #98a2b3;
    box-shadow: 0 8px 18px rgba(15,23,42,0.08);
  }
  .attv-pick-add-plus{
    color: #0f172a;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size: 24px;
    font-weight: 800;
  }

  .attv-pick-lines{
    margin-top: 10px;
    display:flex;
    flex-direction: column;
    gap: 12px;
  }
  .attv-pick-builder{
    border: 1px solid #d0d5dd;
    border-radius: 18px;
    padding: 14px;
    background: #fff;
  }
  .attv-pick-transport{
    display:flex;
    align-items:center;
    justify-content: space-between;
    gap: 12px;
    border-style: solid;
    background: #f8fbff;
  }
  .attv-pick-transport-main{
    min-width: 0;
  }
  .attv-pick-transport-title{
    display:flex;
    align-items:center;
    gap: 8px;
    color: #004382;
  }
  .attv-pick-transport-title i{
    font-size: 18px;
  }
  .attv-pick-transport-title strong{
    font-size: 1.05em;
  }
  .attv-pick-transport-sub{
    margin-top: 2px;
    font-size: 14px;
    color: #475467;
  }
  .attv-pick-transport-price{
    font-size: 1.35em;
    font-weight: 800;
    color: #101828;
    white-space: nowrap;
  }
  .attv-pick-transport-price.is-missing{
    color: #b42318;
  }
  .attv-pick-builder-top{
    display:grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 12px;
  }
  .attv-pick-select{
    border: 1px solid #d0d5dd;
    border-radius: 12px;
    background: #fff;
    position: relative;
  }
  .attv-pick-select:focus-within{
    border-color: #6BB8FF;
    box-shadow: 0 0 0 4px rgba(0,101,193,0.12);
  }
  .attv-pick-select-trigger{
    width: 100%;
    border: none;
    background: transparent;
    min-height: 44px;
    padding: 4px 8px 4px 4px;
    display:flex;
    align-items:center;
    gap: 8px;
    cursor: pointer;
    text-align: left;
    border-radius: 12px;
  }
  .attv-pick-select-value{
    min-width: 0;
    flex: 1;
    font-size: 16px;
    color: #0f172a;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .attv-pick-select-caret{
    color: #667085;
    font-size: 14px;
    flex: 0 0 auto;
  }
  .attv-pick-select-thumb{
    width: 34px;
    height: 34px;
    border-radius: 10px;
    border: 1px solid #d0d5dd;
    background: #f8fafc;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    flex: 0 0 auto;
  }
  .attv-pick-select-thumb img{
    width:100%;
    height:100%;
    object-fit: contain;
    display:block;
  }
  .attv-pick-select-thumb i{
    font-size: 18px;
    color: #475467;
  }
  .attv-pick-select-menu{
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 30;
    border: 1px solid #d0d5dd;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 12px 26px rgba(15,23,42,0.12);
    padding: 6px;
    max-height: 260px;
    overflow: auto;
  }
  .attv-pick-select-option{
    width: 100%;
    border: 1px solid transparent;
    background: transparent;
    border-radius: 10px;
    min-height: 42px;
    padding: 5px 6px;
    display:flex;
    align-items:center;
    gap: 8px;
    cursor: pointer;
    text-align: left;
  }
  .attv-pick-select-option:hover{
    background: #f8fafc;
    border-color: #e2e8f0;
  }
  .attv-pick-select-option.is-active{
    background: #eef6fc;
    border-color: #c7ddf2;
  }
  .attv-pick-select-option-text{
    min-width: 0;
    flex: 1;
    font-size: 14px;
    color: #0f172a;
    font-weight: 700;
  }
  .attv-pick-builder-bottom{
    margin-top: 12px;
    display:grid;
    grid-template-columns: minmax(0,180px) minmax(0,1fr) minmax(0,220px);
    gap: 12px;
    align-items:end;
  }
  .attv-pick-label{
    display:block;
    font-size: 14px;
    color: #344054;
    font-weight: 700;
    margin-bottom: 6px;
  }
  .attv-pick-builder-qty{
    display:flex;
    flex-direction: column;
    gap: 2px;
  }
  .attv-pick-builder-qty .attv-qtyrow{
    border: 1px solid #d0d5dd;
    border-radius: 14px;
    padding: 4px 6px;
    width: fit-content;
    min-width: 130px;
    justify-content: space-between;
  }
  .attv-pick-builder-qty .attv-qtybtn{
    border: none;
    background: transparent;
    width: 28px;
    height: 28px;
    font-size: 20px;
    color: #475467;
  }
  .attv-pick-builder-qty .attv-qtybtn:hover{
    background: #f2f4f7;
    border-radius: 8px;
  }
  .attv-pick-builder-price{
    display:flex;
    flex-direction: column;
    align-items:flex-start;
    gap: 2px;
  }
  .attv-pick-builder-price strong{
    font-size: 1.75em;
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: #101828;
  }
  .attv-pick-builder-price small{
    font-size: 14px;
    color: #667085;
  }
  .attv-pick-builder-actions{
    display:flex;
    gap: 6px;
    justify-content:flex-end;
    flex-wrap: wrap;
  }

  .attv-pick-ghost{
    border: 1px solid var(--attvin-blue-light);
    border-radius: 12px;
    padding: 12px;
    color: var(--muted);
    background: #fbfdff;
    font-size: 15px;
  }
  @media (max-width: 760px){
    .attv-pick-builder-top{
      grid-template-columns: 1fr;
    }
    .attv-pick-builder-bottom{
      grid-template-columns: 1fr;
    }
    .attv-pick-builder-actions{
      justify-content:flex-start;
    }
    .attv-pick-transport{
      flex-direction: column;
      align-items: flex-start;
    }
  }
  .attv-pick-lines-summary{
    margin-top: 6px;
    border-top: 1px solid var(--border);
    padding-top: 10px;
    display:flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items:center;
    justify-content: flex-end;
  }
  .attv-pick-summary-pill{
    background: #f1f5f9;
    color: #0065C1;
    font-weight: 800;
    font-size: 16px;
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid #CCE0F3;
  }
  .attv-pick-line.is-added{
    border-color: #6BB8FF;
    box-shadow: 0 0 0 3px rgba(0,101,193,0.12);
    animation: attvPulse 1s ease;
  }
  @keyframes attvPulse {
    0% { transform: translateY(0); }
    30% { transform: translateY(-2px); }
    100% { transform: translateY(0); }
  }
  .attv-hint.is-success{
    color: #0065C1;
    background: #CCE0F3;
    border: 1px solid #CCE0F3;
    border-radius: 999px;
    padding: 6px 10px;
    display: inline-block;
  }

  .attv-toast{
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 99999;
    background: #0065C1;
    color: #fff;
    padding: 10px 14px;
    border-radius: 999px;
    font-size: 16px;
    font-weight: 800;
    box-shadow: 0 14px 30px rgba(15,23,42,0.25);
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
    transition: opacity .25s ease, transform .25s ease;
  }
  .attv-toast.is-show{
    opacity: 1;
    transform: translateY(0);
  }

  /* ===== Oppsummering (modal) – linjer med sekkebilde + avfallsikon ===== */
  .attv-summary{ margin-top: 12px; display:flex; flex-direction: column; gap: 14px; }

  .attv-sum-addr{
    display:flex; align-items:center; gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--attvin-blue-light);
    background: var(--attvin-blue-tint);
    border-radius: 14px;
  }
  .attv-sum-addr-pin{
    width: 38px; height: 38px; border-radius: 999px;
    display:flex; align-items:center; justify-content:center;
    background: #fff; color: var(--attvin-blue); flex: 0 0 auto;
  }
  .attv-sum-addr-pin i{ font-size: 20px; line-height: 1; }
  .attv-sum-addr-text{ min-width: 0; display:flex; flex-direction: column; }
  .attv-sum-addr-text strong{ font-size: 15px; color: var(--attvin-blue-dark); overflow-wrap: anywhere; }
  .attv-sum-addr-text span{ font-size: 13px; color: var(--muted); }

  .attv-sumgroup{ display:flex; flex-direction: column; gap: 8px; }
  .attv-sumgroup-label{
    font-size: 12px; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.05em;
    color: var(--attvin-blue);
    padding-left: 2px;
  }
  .attv-sumgroup-lines{ display:flex; flex-direction: column; gap: 8px; }

  .attv-sumline{
    display:flex; align-items:center; gap: 12px;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
  }
  .attv-sumline-media{
    position: relative;
    width: 52px; height: 52px; border-radius: 12px;
    background: var(--attvin-blue-tint);
    display:flex; align-items:center; justify-content:center;
    flex: 0 0 auto; overflow: visible;
  }
  .attv-sumline-media > img{
    width: 100%; height: 100%; object-fit: contain;
    border-radius: 12px; display:block; padding: 4px;
  }
  .attv-sumline-media > i{ font-size: 24px; color: var(--attvin-blue); }
  .attv-sumline-badge{
    position: absolute; right: -6px; bottom: -6px;
    width: 26px; height: 26px; border-radius: 999px;
    border: 2px solid #fff; background: #fff; overflow: hidden;
    box-shadow: 0 4px 10px rgba(0,67,130,0.20);
    display:flex; align-items:center; justify-content:center;
  }
  .attv-sumline-badge img{ width: 100%; height: 100%; object-fit: cover; display:block; }
  .attv-sumline-feeicon{
    width: 52px; height: 52px; border-radius: 12px;
    background: var(--attvin-blue-tint); color: var(--attvin-blue);
    display:flex; align-items:center; justify-content:center; flex: 0 0 auto;
  }
  .attv-sumline-feeicon i{ font-size: 22px; }
  .attv-sumline-main{ min-width: 0; flex: 1; }
  .attv-sumline-title{ font-size: 15px; font-weight: 700; color: var(--ink); line-height: 1.25; }
  .attv-sumline-sub{ font-size: 13.5px; color: #3f4a57; font-weight: 500; margin-top: 3px; }
  .attv-sumline-price{ text-align: right; flex: 0 0 auto; }
  .attv-sumline-price strong{ font-size: 15px; font-weight: 700; color: var(--ink); white-space: nowrap; font-variant-numeric: tabular-nums; }
  .attv-sumline-price small{ display:block; font-size: 12px; color: var(--muted); margin-top: 1px; font-variant-numeric: tabular-nums; }

  .attv-summary-total{
    margin-top: 12px;
    border: 1px solid #CCE0F3;
    border-radius: 14px;
    padding: 12px;
    background: #ffffff;
    box-shadow: 0 12px 26px rgba(15,23,42,0.08);
  }
  .attv-summary-row{
    display:flex;
    justify-content: space-between;
    align-items:center;
    font-size: 15px;
    margin-top: 6px;
    color: var(--muted);
    font-weight: 500;
  }
  .attv-summary-row strong{ color: var(--ink); font-weight: 700; }
  .attv-summary-row.is-total{
    margin-top: 14px;
    padding: 12px 14px;
    border-radius: 12px;
    background: var(--attvin-blue);
    color: #fff;
    box-shadow: var(--shadow-blue);
    font-size: 16px;
    font-weight: 700;
  }
  .attv-summary-row.is-total span{ color: #fff; }
  .attv-summary-row.is-total strong{
    color: #fff;
    font-size: 22px;
    letter-spacing: 0.1px;
  }

  .attv-muted { color: var(--muted); }
  .is-hidden { display:none !important; }

  /* Pickups total (step 3) */
  .attv-pick-total{
    display:flex;
    align-items:center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px 14px;
    border-radius: 14px;
    border: 1px solid #CCE0F3;
    color: #004382;
    box-shadow: 0 12px 22px rgba(0,67,130,0.18);
  }
  .attv-pick-total-label{
    font-weight: 800;
    letter-spacing: 0.2px;
  }
  .attv-pick-total-vals{
    display:flex;
    align-items: baseline;
    gap: 10px;
    font-weight: 800;
  }
  .attv-pick-total-vals span{
    font-size: 16px;
    color: #004382;
  }
  .attv-pick-total-fee{
    flex-basis: 100%;
    text-align: right;
    margin-top: 6px;
    font-size: 16px;
    color: #004382;
  }

  /* Modal (system + checkout) */
  .attv-modal { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; }
  .attv-modal.is-open { display: flex; }
  .attv-modal-backdrop { position: absolute; inset: 0; background: rgba(15, 23, 42, 0.35); backdrop-filter: blur(6px); }
  .attv-modal-dialog { position: relative; z-index: 1; width: 100%; max-width: 560px; margin: 18px; }
  .attv-modal-dialog-wide{ max-width: 900px; }
  .attv-modal-dialog{ max-height: 90vh; overflow: hidden; }
  .attv-modal-close { position: absolute; top: 10px; right: 12px; border: none; background: transparent; font-size: 28px; cursor: pointer; color: #94a3b8; }
  .attv-modal-card { background: #fff; border: 1px solid var(--border); border-radius: 18px; box-shadow: var(--shadow); padding: 18px; max-height: 90vh; overflow: auto; }
  .attv-modal-head h2 {
    margin: 0; font-family: var(--font-sans); font-weight: 800;
    font-size: 24px; line-height: 1.2; letter-spacing: -0.01em;
    color: var(--attvin-blue-dark);
  }
  .attv-modal-head p { margin: 6px 0 0; font-size: 16px; color: var(--muted); }
  .attv-modal-fields { margin-top: 12px; }
  .attv-modal-foot { margin-top: 10px; font-size: 16px; }
  #attv-system-body.attv-system-body-rich{
    margin-top: 12px;
    padding: 0;
    border: none;
    background: transparent;
    color: inherit;
  }

  .attv-modal-body-grid{
    margin-top: 14px;
    display:grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 2fr);
    gap: 14px;
  }
  @media (max-width: 800px){
    .attv-modal-body-grid{ grid-template-columns: minmax(0,1fr); }
  }
  .attv-modal-col{ min-width: 0; }

  /* Address suggest */
  .attv-suggest{
    position: absolute;
    z-index: 50;
    left: 0; right: 0;
    top: calc(100% + 6px);
    background: #fff;
    border: 1px solid #d0d5dd;
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(15,23,42,0.12);
    overflow: hidden;
    max-width: 100%;
  }
  .attv-suggest-item{
    width: 100%;
    border: none;
    border-top: 1px solid #f0f2f6;
    background: #fff;
    text-align: left;
    padding: 10px 12px;
    cursor: pointer;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    transition: background-color .12s ease;
  }
  .attv-suggest-item:first-child{ border-top: none; }
  .attv-suggest-item:hover,
  .attv-suggest-item.is-selected{ background: #f5faff; }
  .attv-suggest-icon{
    width: 24px;
    height: 24px;
    border-radius: 999px;
    display:flex;
    align-items:center;
    justify-content:center;
    color: #0065C1;
    background: #e7f1fa;
    font-size: 14px;
  }
  .attv-suggest-main{
    min-width: 0;
    display:flex;
    flex-direction: column;
  }
  .attv-suggest-title{ font-weight: 800; font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .attv-suggest-sub{
    margin-top: 1px;
    font-size: 14px;
    color: var(--muted);
  }
  .attv-suggest-meta{
    font-size: 13px;
    color: #344054;
    font-weight: 700;
    white-space: nowrap;
  }
  @media (max-width: 640px){
    .attv-suggest-item{ grid-template-columns: 24px minmax(0, 1fr); }
    .attv-suggest-meta{ display:none; }
  }

  /* Address minimized mode */
  .attv-step.is-minimized .attv-address-row{ display:none; }
  .attv-address-mini{
    margin-top: 10px;
    border: 1px solid #d6e3f0;
    border-radius: 14px;
    padding: 12px;
    background: #ffffff;
    display:grid;
    grid-template-columns: minmax(0,1fr) minmax(260px, 340px);
    gap: 10px;
    max-width: 100%;
  }
  .attv-address-mini-head{
    display:flex;
    align-items:flex-start;
    justify-content: space-between;
    gap: 10px;
  }
  .attv-address-mini-main{
    min-width: 0;
  }
  .attv-address-mini strong{ font-size: 16px; }
  .attv-address-mini-main > span{
    font-size: 15px;
    color: var(--muted);
    display:block;
    margin-top: 2px;
    overflow-wrap: anywhere;
  }
  .attv-address-mini strong{
    overflow-wrap: anywhere;
  }
  .attv-address-placement{
    margin-top: 12px;
    border: 1px solid var(--attvin-blue-light);
    background: var(--attvin-blue-tint);
    border-radius: 14px;
    padding: 14px;
  }
  .attv-address-placement-title{
    display:flex;
    align-items:center;
    gap: 10px;
    font-size: 14px;
    font-weight: 700;
    color: var(--attvin-blue-dark);
    margin-bottom: 12px;
  }
  .attv-address-placement-ic{
    width: 34px; height: 34px; border-radius: 10px;
    background: var(--attvin-blue); color: #fff;
    display:flex; align-items:center; justify-content:center; flex: 0 0 auto;
  }
  .attv-address-placement-ic i{ font-size: 18px; }
  .attv-placement-list{
    margin: 0; padding: 0; list-style: none;
    display: grid; gap: 8px;
  }
  .attv-placement-list li{
    display:flex; align-items:flex-start; gap: 8px;
    font-size: 14px; color: #26405c; line-height: 1.4;
  }
  .attv-placement-list li i{
    color: var(--attvin-green-dark); font-size: 18px; flex: 0 0 auto; margin-top: 1px;
  }
  .attv-address-map{
    border: 1px solid var(--attvin-blue-light);
    border-radius: 12px;
    overflow: hidden;
    height: 200px;
    background: #f8fafc;
    max-width: 100%;
    position: relative;
  }
  /* Kartet fyller boksen; iframen forankres i topp og gjøres høyere slik at
     OpenStreetMap-attribusjonslinja nederst klippes bort av overflow:hidden. */
  .attv-address-map iframe{
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: calc(100% + 48px);
    border: none;
    display:block;
  }
  .attv-address-map-empty{
    border: 1px solid #d0d5dd;
    border-radius: 12px;
    padding: 10px 12px;
    display:flex;
    align-items:center;
    gap: 8px;
    color: #475467;
    font-size: 14px;
    max-width: 100%;
  }
  .attv-address-map-empty i{
    color: #0065C1;
    font-size: 18px;
    flex: 0 0 auto;
  }
  @media (max-width: 900px){
    .attv-address-mini{
      grid-template-columns: 1fr;
    }
    .attv-address-map{
      height: 170px;
    }
  }

  /* Payment lock banner */
  .attv-banner{
    border: 1px solid #e5e7eb;
    border-radius: 16px;
    padding: 14px 16px;
    background: #fff7ed;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 8px 0 18px;
    box-shadow: 0 10px 26px rgba(15,23,42,0.06);
  }
  .attv-banner-title{ font-weight: 800; font-size: 16px; }
  .attv-banner-sub{ margin-top: 4px; color: var(--muted); }
  .attv-banner-meta{ margin-top: 6px; font-size: 12px; color: #6b7280; }
  .attv-banner-note{ margin-top: 8px; font-size: 12px; color: #374151; }
  .attv-banner-actions{ display: flex; gap: 10px; flex-wrap: wrap; }
  @media (max-width: 720px){
    .attv-banner{ flex-direction: column; align-items: flex-start; }
    .attv-banner-actions{ width: 100%; }
    .attv-banner-actions .attv-btn{ width: 100%; justify-content: center; }
  }

  /* Lock checkout while payment is pending */
  .attv.is-locked .attv-main{
    pointer-events: none;
    opacity: 0.6;
    filter: grayscale(0.2);
  }

  .attv-compliance-list{
    display: grid;
    gap: 10px;
    margin-top: 12px;
  }
  .attv-compliance-card{
    border: 1px solid #e4e7ec;
    border-radius: 14px;
    padding: 12px;
    background: #fff;
    box-shadow: 0 8px 18px rgba(15,23,42,0.05);
  }
  .attv-compliance-head{
    display:flex;
    align-items:center;
    gap: 10px;
    margin-bottom: 8px;
  }
  .attv-compliance-icon{
    width: 48px;
    height: 48px;
    border-radius: 12px;
    border: 1px solid #dbeafe;
    background: #eff6ff;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow: hidden;
    flex: 0 0 auto;
  }
  .attv-compliance-icon img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .attv-compliance-icon span{
    font-size: 20px;
  }
  .attv-compliance-title{
    font-weight: 800;
    font-size: 16px;
  }
  .attv-compliance-sub{
    margin-top: 2px;
    font-size: 12px;
    color: #475467;
  }
  .attv-compliance-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  @media (max-width: 680px){
    .attv-compliance-grid{
      grid-template-columns: 1fr;
    }
  }
  .attv-waste-box{
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 10px;
    background: #f8fafc;
    font-size: 13px;
    color: #334155;
  }
  .attv-waste-box-ok{
    border-color: #bbf7d0;
    background: #f0fdf4;
  }
  .attv-waste-box-no{
    border-color: #fecaca;
    background: #fef2f2;
  }
  .attv-waste-box-title{
    font-weight: 800;
    color: #0f172a;
  }
  .attv-waste-box-body{
    margin-top: 6px;
    white-space: pre-wrap;
    font-size: 14px;
    line-height: 1.5;
  }
  .attv-sekk-info{
    display: grid;
    gap: 10px;
  }
  .attv-sekk-info-head{
    display:flex;
    align-items:center;
    gap: 10px;
  }
  .attv-sekk-info-icon{
    width: 50px;
    height: 50px;
    border-radius: 12px;
    border: 1px solid #dbeafe;
    background: #eff6ff;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    flex: 0 0 auto;
  }
  .attv-sekk-info-icon img{
    width:100%;
    height:100%;
    object-fit: cover;
    display:block;
  }
  .attv-sekk-info-icon i{
    font-size: 22px;
    color: #1d4ed8;
  }
  .attv-sekk-info-head-text{
    min-width: 0;
  }
  .attv-sekk-info-title{
    font-size: 17px;
    font-weight: 800;
    color: #101828;
  }
  .attv-sekk-info-sub{
    margin-top: 2px;
    font-size: 14px;
    color: #475467;
  }
  .attv-sekk-info-grid{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .attv-sekk-panel{
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 10px;
    background: #f8fafc;
  }
  .attv-sekk-panel-ok{
    border-color: #bbf7d0;
    background: #f0fdf4;
  }
  .attv-sekk-panel-no{
    border-color: #fecaca;
    background: #fef2f2;
  }
  .attv-sekk-panel-title{
    display:flex;
    align-items:center;
    gap: 6px;
    font-size: 14px;
    font-weight: 800;
    color: #0f172a;
  }
  .attv-sekk-panel-title i{
    font-size: 16px;
  }
  .attv-sekk-list{
    margin: 8px 0 0;
    padding-left: 18px;
    display:grid;
    gap: 4px;
    font-size: 14px;
    color: #334155;
  }
  .attv-sekk-empty{
    margin: 8px 0 0;
    font-size: 14px;
    color: #667085;
  }
  .attv-sekk-info-foot{
    border: 1px solid #fed7aa;
    background: #fff7ed;
    color: #9a3412;
    border-radius: 10px;
    padding: 8px 10px;
    font-size: 13px;
    font-weight: 700;
  }
  @media (max-width: 640px){
    .attv-sekk-info-grid{
      grid-template-columns: 1fr;
    }
  }
  .attv-checkrow{
    margin-top: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #334155;
    border: 1px solid #d0d5dd;
    border-radius: 12px;
    background: #fff;
    padding: 10px 12px;
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
  }
  .attv-checkrow:hover{
    border-color: #98a2b3;
    background: #f8fafc;
  }
  .attv-checkrow input{
    width: 22px;
    height: 22px;
    margin: 0;
    accent-color: #0065C1;
    flex: 0 0 auto;
    cursor: pointer;
  }
  .attv-checkrow-body{
    min-width: 0;
    display:flex;
    flex-direction: column;
    gap: 2px;
  }
  .attv-checkrow-body strong{
    font-size: 15px;
    color: #0f172a;
    line-height: 1.3;
  }
  .attv-checkrow-body small{
    font-size: 13px;
    color: #475467;
    line-height: 1.4;
  }
  .attv-checkrow.is-checked{
    border-color: #6BB8FF;
    background: #eef6fc;
    box-shadow: 0 0 0 4px rgba(0,101,193,0.08);
  }
  .attv-checkrow-confirm{
    margin-top: 12px;
  }
  .attv-checkrow-fee{
    margin-top: 12px;
  }

  /* ===================== STEGINDIKATOR (stepper) ===================== */
  .attv-stepper{
    display:flex;
    align-items:flex-start;
    gap: 0;
    padding: 4px 4px 2px;
    margin-bottom: 4px;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .attv-stepper::-webkit-scrollbar{ display:none; }
  .attv-stepper .step{
    position: relative;
    flex: 1 1 0;
    min-width: 72px;
    display:flex;
    flex-direction: column;
    align-items:center;
    gap: 8px;
    padding-top: 6px;
    color: var(--muted);
    font-family: var(--font-sans);
    text-align: center;
  }
  /* forbindelseslinje mellom stegene */
  .attv-stepper .step::before{
    content:"";
    position:absolute;
    top: 20px;
    right: 50%;
    width: 100%;
    height: 3px;
    background: var(--attvin-blue-light);
    border-radius: 999px;
    z-index: 0;
  }
  .attv-stepper .step:first-child::before{ display:none; }
  .attv-stepper .step.is-active::before,
  .attv-stepper .step.is-done::before{ background: var(--attvin-blue); }
  .attv-stepper .step .n{
    position: relative;
    z-index: 1;
    display:flex;
    align-items:center;
    justify-content:center;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: #fff;
    border: 2px solid var(--attvin-blue-light);
    color: var(--muted);
    font-weight: 800;
    font-size: 15px;
    transition: background-color .2s ease, border-color .2s ease, color .2s ease, transform .12s ease;
  }
  .attv-stepper .step .lbl{
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0;
    max-width: 96px;
  }
  .attv-stepper .step.is-active .n{
    background: var(--attvin-blue);
    border-color: var(--attvin-blue);
    color: #fff;
    transform: scale(1.06);
    box-shadow: 0 6px 16px rgba(0,101,193,0.30);
  }
  .attv-stepper .step.is-active .lbl{ color: var(--attvin-blue-dark); font-weight: 700; }
  .attv-stepper .step.is-done .n{
    background: var(--attvin-blue-light);
    border-color: var(--attvin-blue);
    color: var(--attvin-blue-dark);
  }
  .attv-stepper .step.is-done{ cursor: pointer; color: var(--attvin-blue-dark); }
  .attv-stepper .step.is-done:hover .n{ background: var(--attvin-blue-medium); border-color: var(--attvin-blue-dark); }
  @media (max-width: 560px){
    .attv-stepper .step .lbl{ display:none; }
    .attv-stepper .step{ min-width: 44px; }
    .attv-stepper .step::before{ top: 18px; }
  }

  /* ===================== STICKY SUM-LINJE (cartbar) ===================== */
  .attv-cartbar{
    position: fixed;
    left: 50%;
    bottom: 16px;
    transform: translateX(-50%);
    z-index: 200;
    width: min(680px, calc(100% - 24px));
    display:flex;
    align-items:center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 12px 12px 20px;
    background: rgba(255,255,255,0.92);
    backdrop-filter: saturate(1.2) blur(10px);
    border: 1px solid var(--attvin-blue-light);
    border-radius: 999px;
    box-shadow: 0 18px 40px rgba(0,67,130,0.20);
    animation: attvCartUp .28s cubic-bezier(0.2, 0.8, 0.2, 1);
  }
  @keyframes attvCartUp{
    from{ opacity:0; transform: translate(-50%, 14px); }
    to{ opacity:1; transform: translate(-50%, 0); }
  }
  .attv-cartbar-info{
    display:flex;
    flex-direction: column;
    line-height: 1.15;
    min-width: 0;
  }
  .attv-cartbar-info #attv-cartbar-count{
    font-size: 13px;
    color: var(--muted);
    font-weight: 600;
  }
  .attv-cartbar-info #attv-cartbar-total{
    font-size: 20px;
    font-weight: 800;
    color: var(--attvin-blue-dark);
    font-variant-numeric: tabular-nums;
  }
  .attv-cartbar .attv-btn-primary{
    white-space: nowrap;
    padding: 12px 22px;
  }
  @media (max-width: 640px){
    .attv-cartbar{ bottom: 12px; padding-left: 18px; }
    .attv-cartbar .attv-btn-primary{ padding: 12px 18px; }
  }

  /* ===================== KONTAKT + BETALING (modal, høyre kol.) ===================== */
  .attv-pay-card{ display:flex; flex-direction: column; }
  .attv-pay-type{
    margin-top: 12px;
    display:flex; align-items:center; gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--attvin-blue-light);
    background: var(--attvin-blue-tint);
    border-radius: 14px;
  }
  .attv-pay-type > i{ font-size: 26px; color: var(--attvin-blue); flex: 0 0 auto; }
  .attv-pay-type-text{ display:flex; flex-direction: column; min-width: 0; }
  .attv-pay-type-k{
    font-size: 11px; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.05em; color: var(--attvin-blue);
  }
  .attv-pay-type-v{ font-size: 15px; font-weight: 600; color: var(--attvin-blue-dark); }

  .attv-pay-card .attv-modal-fields{
    margin-top: 14px;
    display:flex; flex-direction: column; gap: 12px;
  }
  .attv-pay-action{ margin-top: 16px; }
  .attv-pay-action .attv-btn-block{ margin-top: 4px; }

  /* Vipps-knapp (privatkunder) */
  .attv-btn-vipps{
    background: #FF5B24;
    color: #fff;
    box-shadow: none;
  }
  .attv-btn-vipps:hover{ background: #E5511F; box-shadow: none; }
  .attv-btn-vipps .attv-btn-label{ font-weight: 800; }

  /* ===================== "Se hva du kan ha i sekkene" (tomme sekker) ===================== */
  .attv-guide-btn{
    width: 100%;
    display:flex; align-items:center; gap: 14px;
    padding: 14px 16px; margin-top: 12px;
    border: 1px solid var(--attvin-blue-light);
    background: var(--attvin-blue-tint);
    border-radius: 16px; cursor: pointer; text-align: left;
    transition: transform .08s ease, box-shadow .18s ease, border-color .18s ease, background-color .18s ease;
  }
  .attv-guide-btn:hover{ transform: translateY(-1px); border-color: var(--attvin-blue-medium); box-shadow: var(--shadow-sm); }
  .attv-guide-btn:active{ transform: translateY(0); }
  .attv-guide-btn-ic{
    width: 44px; height: 44px; border-radius: 12px; flex: 0 0 auto;
    background: var(--attvin-blue); color: #fff;
    display:flex; align-items:center; justify-content:center;
  }
  .attv-guide-btn-ic i{ font-size: 24px; }
  .attv-guide-btn-text{ flex: 1; min-width: 0; display:flex; flex-direction: column; }
  .attv-guide-btn-text strong{ font-size: 16px; color: var(--attvin-blue-dark); font-weight: 700; }
  .attv-guide-btn-text small{ font-size: 13px; color: var(--muted); margin-top: 2px; }
  .attv-guide-btn-arrow{ color: var(--attvin-blue); font-size: 20px; flex: 0 0 auto; }

  /* Avfallsguide-modal: liste over avfallstyper */
  .attv-guide-list{ display:grid; gap: 12px; }
  .attv-guide-card{
    border: 1px solid var(--line); border-radius: 14px; padding: 12px; background: #fff;
  }
  .attv-guide-card-head{ display:flex; align-items:center; gap: 10px; margin-bottom: 10px; }
  .attv-guide-card-icon{
    width: 40px; height: 40px; border-radius: 10px; flex: 0 0 auto; overflow: hidden;
    background: var(--attvin-blue-tint); color: var(--attvin-blue);
    display:flex; align-items:center; justify-content:center;
  }
  .attv-guide-card-icon img{ width:100%; height:100%; object-fit: cover; display:block; }
  .attv-guide-card-icon i{ font-size: 20px; }
  .attv-guide-card-name{ font-size: 16px; font-weight: 700; color: var(--attvin-blue-dark); }

  /* ===================== Gebyr-banner (bekreft sortering) ===================== */
  .attv-fee-banner{
    display:flex; align-items:flex-start; gap: 12px;
    padding: 14px 16px; margin-bottom: 12px;
    border: 1px solid var(--attvin-yellow-dark);
    background: var(--attvin-yellow-light);
    border-radius: 14px;
  }
  .attv-fee-banner > i{ font-size: 24px; color: #8a5a06; flex: 0 0 auto; margin-top: 1px; }
  .attv-fee-banner strong{ display:block; font-size: 15px; color: #7a4f05; }
  .attv-fee-banner span{ display:block; font-size: 13.5px; color: #6b4a12; margin-top: 3px; line-height: 1.45; }

  /* ===================== Bredde-tilpasning (container flukter med stegkortene) =====================
     Containeren er bred, men enkeltfelt/tekst holdes på lesbar bredde. */
  .attv-step p { max-width: 62ch; }
  .attv-address-mini { max-width: 900px; }

  /* Steg 1: adressefelt til venstre + dekorativ sekk til høyre (fyller bredden) */
  .attv-address-layout{
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
    gap: 28px;
    align-items: stretch;
    margin-top: 14px;
  }
  .attv-address-layout .attv-address-row{ margin-top: 0; }
  .attv-step.is-minimized .attv-address-layout{ display: none; }

  .attv-address-visual{
    position: relative;
    border-radius: 18px;
    background: var(--attvin-blue-tint);
    border: 1px solid var(--attvin-blue-light);
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow: hidden;
  }
  .attv-address-visual-media{
    flex: 1;
    min-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .attv-address-visual-media img{
    max-width: 100%;
    max-height: 240px;
    object-fit: contain;
    display: block;
  }
  .attv-address-visual-media i{ font-size: 72px; color: var(--attvin-blue); opacity: .85; }
  .attv-address-visual-text strong{
    display: block; font-size: 16px; font-weight: 700; color: var(--attvin-blue-dark);
  }
  .attv-address-visual-text span{
    display: block; margin-top: 4px; font-size: 14px; line-height: 1.5; color: #26405c;
  }
  @media (max-width: 760px){
    .attv-address-layout{ grid-template-columns: 1fr; gap: 16px; }
    .attv-address-visual{ display: none; }
  }