@import url(./_font.css);
@import url(./_reboot.css);
@import url(./_grid.css);
@import url(./_utilities.css);
@import url(https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css);

:root {
    --blue:#0099FF;
    --green:#2AED3E;
    --yellow:#FFCC00;
    --red:#FF2222;
    --indigo:#B100BE;
    --black: #000;
    --white: #FFFFFF;

    --gray:var(--gray-600);
    --gray-dark:var(--gray-900);
    --gray-600:#899398;
    --gray-900:#1D1D1E;

    /* 프라이머리 컬러 (주요 색상) */
    --primary:var(--blue);
    --primary-emphasis:#0681D4;
    --primary-100:#EDF8FF;
    
    --white-100:#F2F2F2;

    --success:var(--green);
    --warning:var(--yellow);
    --info:var(--indigo);
    --danger:var(--red);
    --danger-100:#FFEDED;

    /* 배경 색상 */
    --bg-primary:var(--primary);
    --bg-light-primary:var(--primary-100);
    --bg-light:#F2F2F2;
    --bg-success:var(--success);
    --bg-warning:var(--warning);
    --bg-info:var(--info);
    --bg-danger:var(--danger);
    --bg-light-danger:var(--danger-100);

    /* 테두리 색상 */
    --border-color:#EBEBEB;

    --body-bg:linear-gradient(180deg, #E7EFF4 0%, #F6F9FA 100%);
    --body-color:var(--gray-dark);

    --emphsis-color:var(--black);
    --secondary-color:var(--gray);
    --secondary-bg:#F2F2F2;
    /* --tertiary-color:; */


    --border-radius-2:8px;
    --border-radius-4:16px;
    --border-radius-pill:999rem;


    /*  */
    --input-padding-y:12px;
    --input-padding-x:1rem;
    --input-font-size:14px;
    --input-font-weight:400;
    --input-font-family:var(--font-family-base);
    --input-line-height:1;

    --input-bg: var(--bg-light);

    --input-color: var(--body-color);
    --input-border-color: transparent;
    --input-border-width: 1px;
    --input-border-radius: var(--border-radius-2);

    --input-focus-bg: var(--input-bg);
    --input-focus-border-color: transparent;
    --input-focus-color: inherit;
    --input-focus-width: inherit;
    --input-focus-box-shadow: inherit;

    --input-placeholder-color: var(--secondary-color);
    --input-plaintext-color: var(--body-color);

    --input-transition: var(--transition);

    
    --btn-font-weight:600;
    --btn-border-width:1px;
    --btn-border-radius:var(--input-border-radius);
    --btn-padding-y:var(--input-padding-y);
    --btn-padding-x:var(--input-padding-x);
    --btn-transition:var(--input-transition);
    --btn-line-height:var(--input-line-height);
    --btn-font-size:15px;

    --btn-primary-color:var(--white);
    --btn-primary-bg:var(--primary);
    --btn-primary-border-color:transparent;

    --btn-primary-color-hover:var(--white);
    --btn-primary-bg-hover:var(--primary-emphasis);
    --btn-primary-border-color-hover:transparent;

    --btn-primary-color-disabled:var(--white);
    --btn-primary-bg-disabled:var(--gray);
    --btn-primary-border-color-disabled:transparent;

    --btn-white-color:var(--body-color);
    --btn-white-bg:var(--white);
    --btn-white-border-color:transparent;

    --btn-white-color-hover:var(--body-color);
    --btn-white-bg-hover:var(--primary-100);
    --btn-white-border-color-hover:transparent;

    --btn-light-primary-color:var(--primary);
    --btn-light-primary-color-hover:var(--primary);
    --btn-light-primary-bg-hover:var(--white-100);
    --btn-light-primary-bg:var(--primary-100);
    --btn-light-primary-color-disabled:var(--white);
    --btn-light-primary-bg-disabled:var(--gray);
    --btn-light-primary-border-color:transparent;
    --btn-light-primary-border-color-hover:transparent;
    --btn-light-primary-border-color-disabled:transparent;
    

    --form-label-margin-bottom: 0;
    --form-label-font-size: 12px;
    --form-label-font-style: inherit;
    --form-label-font-weight: inherit;
    --form-label-color: inherit;

    /* transition */
    --transition-duration: 150ms;
    --transition-ease-in-out: ease-in-out;
    --transition-ease: cubic-bezier(0.4, 0, 0.2, 1);

    --transition-none: none;
    --transition-all: all var(--transition-duration) var(--transition-ease);
    --transition-colors: color var(--transition-duration) var(--transition-ease),
    background-color var(--transition-duration) var(--transition-ease),
    border-color var(--transition-duration) var(--transition-ease),
    text-decoration-color var(--transition-duration) var(--transition-ease),
    fill var(--transition-duration) var(--transition-ease),
    stroke var(--transition-duration) var(--transition-ease);
    --transition-opacity: opacity var(--transition-duration) var(--transition-ease);
    --transition-shadow: box-shadow var(--transition-duration) var(--transition-ease);
    --transition-transform: transform var(--transition-duration) var(--transition-ease);

    --transition: color var(--transition-duration, 150ms) var(--transition-ease, ease),
    background-color var(--transition-duration, 150ms) var(--transition-ease, ease),
    box-shadow var(--transition-duration, 150ms) var(--transition-ease, ease),
    border-color var(--transition-duration, 150ms) var(--transition-ease, ease);
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-transition: background-color 9999s ease-out;
    -webkit-box-shadow: 0 0 0px 1000px var(--input-bg) inset !important;
    -webkit-text-fill-color: var(--input-color) !important;
    background-color:var(--input-bg) !important;
}

.form-input {
    display: block;
    width: 100%;
    padding: var(--input-padding-y) var(--input-padding-x);
    font-family: var(--input-font-family);
    font-size:var(--input-font-size);
    font-weight: var(--input-font-weight);
    line-height: var(--input-line-height);
    color: var(--input-color);
    background-color: var(--input-bg);
    background-clip: padding-box;
    border: var(--input-border-width) solid var(--input-border-color);
    appearance: none;
    border-radius:var(--input-border-radius, 0);
    transition:var(--input-transition);
}
.form-input::placeholder {color:var(--input-placeholder-color)}
.form-input:focus {
    color: var(--input-focus-color);
    background-color: var(--input-focus-bg);
    border-color: var(--input-focus-border-color);
    outline:none;
}
.form-input:disabled {color:var(--secondary-color)}

.form-label {
    margin-bottom: var(--form-label-margin-bottom);
    padding:0 8px;
    font-size: var(--form-label-font-size);
    font-style: var(--form-label-font-style);
    font-weight: var(--form-label-font-weight);
    color: var(--form-label-color);
}

.form-field {display:flex;flex-direction:column;gap:8px;}
.form-field ~ .form-field {margin-top:1rem}
.form-divider {margin:24px 0;height:1px;width:100%;background-color:var(--border-color);}

.form-select-default {appearance:none;background: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%231D1D1E' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") no-repeat right center;}
.form-select {outline:none;width:100%}
.form-select:invalid {color:var(--secondary-color)}
.form-select option {color:var(--body-color)}

/*  */
.form-quantity {width:112px;display:flex;align-items:center;padding:4px 8px;border-radius:999rem;background-color:var(--bg-light)}
.form-quantity .quantity-btn {line-height:1;}
.form-quantity .quantity-value {flex:0 0 32px;display:block;text-align:center;}
.form-quantity .icon-quantity-minus{width:32px;height:32px;background: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.3431 16H21.6568' stroke='%231D1D1E' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") no-repeat 50% 50%;}
.form-quantity .icon-quantity-plus{width:32px;height:32px;background: url("data:image/svg+xml,%3Csvg width='32' height='32' viewBox='0 0 32 32' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 10.3431V21.6569M10.3431 16H21.6568' stroke='%231D1D1E' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") no-repeat 50% 50%;}

/*  */
.form-check {position:relative;line-height:1;}
.form-check-input {appearance:none;width:1rem;height:1rem;border-radius:.5rem;border:1px solid var(--secondary-color);background: url("data:image/svg+xml,%3Csvg width='16' height='17' viewBox='0 0 16 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8.5' r='7.5' stroke='%23899398'/%3E%3C/svg%3E%0A") no-repeat center center;}
.form-check-input:checked {border-color:var(--primary);background-image: url("data:image/svg+xml,%3Csvg width='16' height='17' viewBox='0 0 16 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8.5' r='7.5' stroke='%230099FF'/%3E%3Ccircle cx='8' cy='8.5' r='4.5' fill='%230099FF' stroke='%230099FF'/%3E%3C/svg%3E%0A");}
.form-check-input:focus {outline:none}

/*  */
.input-group {position:relative;display:flex;align-items:center;gap:8px;}
.input-group-text {font-size:14px;color:var(--text-secondary)}
div.form-input {overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.input-group-actions {position:absolute;right:1rem;top:12px}
.input-group-actions .icon-input-delete {width:24px;height:24px;border-radius:8px;background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 12H8' stroke='%2348322B' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");transition:var(--transition);}
.input-group-actions .icon-input-delete:hover {background-color:var(--bg-primary-sub)}
.input-group-actions ~ .form-input {padding-right:calc(var(--input-padding-x) * 3)}

/*  */
.btn {
    display: inline-flex;
    align-items:center;justify-content:center;
    font-weight: var(--btn-font-weight);
    white-space: nowrap;
    vertical-align: middle;
    user-select: none;
    border: var(--btn-border-width) solid transparent;
    padding:var(--btn-padding-y) var(--btn-padding-x);
    border-radius:var(--btn-border-radius);
    font-size:var(--btn-font-size);
    line-height:var(--btn-line-height);
    transition: var(--btn-transition);
}
.btn-xs {height:27px;padding:4px 12px;border-radius:8px}
.btn:focus,
.btn.focus {outline:0; box-shadow:var(--btn-focus-box-shadow);}
.btn.disabled,
.btn:disabled {opacity: var(--btn-disabled-opacity);}
.btn:not(:disabled):not(.disabled) {cursor: pointer;}
/*  */
.btn-primary {color:var(--btn-primary-color);background-color:var(--btn-primary-bg);border-color:var(--btn-primary-border-color)}
.btn-primary:hover {color:var(--btn-primary-color-hover);background-color:var(--btn-primary-bg-hover);border-color:var(--btn-primary-border-color-hover)}
.btn-primary:disabled {color:var(--btn-primary-color-disabled);background-color:var(--btn-primary-bg-disabled);border-color:var(--btn-primary-border-color-disabled)}
.btn.text-danger:not(.alert-action-item):hover {background-color:var(--bg-light-danger)}
.btn-light-primary {color:var(--btn-light-primary-color);background-color:var(--btn-light-primary-bg);border-color:var(--btn-light-primary-border-color)}
.btn-white {color:var(--btn-white-color);background-color:var(--btn-white-bg);border-color:var(--btn-white-border-color)}
.btn-white:hover {color:var(--btn-white-color-hover);background-color:var(--btn-white-bg-hover);border-color:var(--btn-white-border-color-hover)}
.btn-link {color:var(--primary)}
.btn-link:hover {color:var(--primary-emphasis)}


html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* line-height: 1.25; */
    color: var(--body-color);
    font-family: var(--font-family-base);
    font-weight: var(--font-weight-base);
}
body,html{width:100%;}
body{min-height:100vh;}

hr{border-color:var(--border-color);}
::placeholder{color:var(--white-200);}
[class^='icon']{flex-shrink:0;display:inline-flex;background-repeat:no-repeat;background-position:center center;background-size:contain;text-indent:-9999em;}
.icon-plus-circle {width:24px;height:24px;background-image:url(../images/ic_plus_circle.svg);}
/*  */
.w-full {width:100% !important}
.font-semibold {font-weight:600 !important}
.text-secondary {color:var(--secondary-color) !important}
.text-primary {color:var(--primary) !important}
.text-danger {color:var(--danger) !important}
.bg-primary {background-color:var(--bg-primary) !important;}
.bg-info {background-color:var(--bg-info) !important;}
.bg-success {background-color:var(--bg-success) !important;}
.bg-warning {background-color:var(--bg-warning) !important;}
.bg-danger {background-color:var(--bg-danger) !important;}
.bg-light-primary {background-color:var(--bg-light-primary) !important;}
.bg-light-danger {background-color:var(--bg-light-danger) !important;}

/*  */
body {display:flex;flex-direction:column;}
.adro {display:flex;flex-direction:column;align-items:center;flex:1 1 0}
.adro-container {width:100%;flex:1 1 0;background:var(--body-bg);display:flex;flex-direction:column;}

/*  */
.adro-header {position:sticky;top:0;display:flex;flex-direction:column;align-items:center;}
.adro-header:not(.adro-header-sub) .adro-component {display:flex;flex-direction:column;align-items:center;}
.adro-header .adro-component {padding-top:24px;padding-bottom:24px;}
.adro-header-sub  {background-color:#ffffff;z-index:999;}
.adro-header-sub .adro-component {padding:1rem 1rem;}
.adro-header .headder-title {}
.adro-header .headder-title-link {}
.adro-header .header-title-logo {display:block;width:60px;height:20px;background:url(../images/h1_page_logo.svg) no-repeat center center;}
.adro-header .header-subtitle {margin-top:12px;color:var(--secondary-color);font-size:12px;}
.adro-header .header-link {display:flex;width:24px;height:24px;}
.adro-header .icon-header-back {width:24px;height:24px;background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 18L9 12L15 6' stroke='%231D1D1E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");}

/*  */
.adro-body {position:relative;z-index:1;flex:1 1 0}

/*  */
.adro-actions {position:sticky;bottom:0;z-index:999}
.adro-actions .adro-component {display:flex;gap:8px;padding:1rem !important}
.adro-actions .adro-component > .btn {flex:1 1 0}

/*  */
.page-container {}
.adro-component {position:relative;width:100%;max-width:768px;padding:0 1rem;margin:0 auto}
.page-header {padding:8px 8px 24px;}
.page-title {font-size:24px;font-weight:600;}
.page-summary {background-color:#fff;}
.page-summary .adro-component {padding:1rem 24px 1.5rem;}
.page-summary .section {padding-top:24px;margin-top:24px;border-top:1px solid var(--border-color);}
.page-summary .section-header {margin-bottom:1rem}
.page-summary .product-group-min {padding-bottom:0}
.page-summary .content-info .info-row ~ .info-row {margin-top:1rem;}
.page-summary ~ .page-body {padding-top:24px;}

.page-body {padding-bottom:40px}
.section-bleed {background-color:#fff;padding:24px}

/*  */
.card {display:flex;flex-direction:column;border-radius:1rem;background-color:#fff;}
.card + .card {margin-top:8px;}
.card-header {padding:24px 1rem 0}
.card-title {font-size:18px;font-weight:600;}
.card-title-md {font-size:1rem;font-weight:600;}
.card-body {padding:24px 1rem 24px}
.card-actions {padding:0 1rem 1rem;display:flex;gap:8px}
.card-actions > .btn {flex:1 1 0}

.content-info {}
.content-info ~ .content-info {margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border-color)}
.content-info .info-row {position:relative;display:flex;gap:40px;}
.content-info .info-row ~ .info-row {margin-top:8px}
.content-info .info-row .info-column {display:flex; flex-direction:column;min-width:0}
.content-info .info-row .info-value {overflow:hidden;text-overflow:ellipsis;max-width:100%;white-space:nowrap;}
.content-info .info-row .info-label {overflow:hidden;text-overflow:ellipsis;max-width:100%;white-space:nowrap;display:block;margin-top:2px;font-size:12px;color:var(--secondary-color);}
.content-info .info-row .info-link {position:relative;display:inline-flex;gap:4px;align-items:center;transition:var(--transition)}
.content-info .info-row .info-link:after {line-height:1; content:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 12L10 8L6 4' stroke='%231D1D1E' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");}
.content-info .info-row .info-link:hover {color:var(--secondary-color)}
.content-info .info-row .info-action-edit {position:absolute;right:0;top:0;font-size:15px;font-weight:600;padding:4px 12px;color:var(--primary);border-radius:8px}
.content-info .info-row .info-action-edit:hover {background-color:var(--bg-light-primary);}
.content-info .info-row .info-column-lg .info-value {font-size:18px;font-weight:600}
.content-info .info-row .info-column-xl .info-value {font-size:32px;font-weight:600}
.content-info .info-row-center {justify-content:center;padding-bottom:0}
.content-info .info-row-center .info-column-xl {align-items:center;}

/*  */
.content-card {}
.content-card .card-body {display:flex;padding:1rem;gap:1rem;align-items:center;}
.content-card ~ .address-card {margin-top:8px}
.content-card .info-title {font-weight:600;font-size:15px;}
.content-card .info-title strong {font-weight:inherit}
.content-card .info-content {flex:1 1 0}
.content-card .info-detail {font-size:14px;color:var(--secondary-color)}
.content-card .info-title + .info-detail {margin-top:4px}


/*  */
.adro-home {}
.adro-home .adro-body {padding-bottom:40px}
.adro-home .card-summary .card-body {padding-top:40px}
.adro-home .card-summary .summary-content {display:flex;justify-content:center;gap:40px}
.adro-home .card-summary .summary-actions {max-width:400px;;margin:40px auto 0;display:flex;flex-direction:column;align-items:center;gap:1rem}
.adro-home .card-summary .summary-action-item {width:100%;font-size:15px;font-weight:600;gap:8px}
.adro-home .card-summary .summary-action-link {font-size:15px;font-weight:600;}
.adro-home

    /*  */
.adro-order {}
/* .adro-order .page-summary .adro-component {padding:1rem 1rem 40px} */
.adro-order .product-category {}
.adro-order .product-category .category {border-radius:1rem;background-color:#fff;}
.adro-order .product-category .category ~ .category {margin-top:8px;}
.adro-order .product-category .category-header {}
.adro-order .product-category .category-toggle {display:flex;align-items:center;padding:24px 1rem;gap:12px;width:100%;background: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%231D1D1E' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A") no-repeat right 24px center;}
.adro-order .product-category .category-logo {width:24px;height:24px;}
.adro-order .product-category .category-title {font-size:15px;font-weight:600}
.adro-order .product-category .category-body {overflow:hidden;max-height:0}
.adro-order .product-category .category.is-active .category-toggle {background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 10L8 6L12 10' stroke='%231D1D1E' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");}

/*  */
.adro-address {background:#EEF0F2;}
.adro-address .section ~ .section {margin-top:24px}
.adro-address .adro-header {background-color:#EEF0F2;}
.adro-address .form-input {--input-bg:#fff;--input-focus-bg:#fff;}
.adro-address .form-input:focus {--input-bg:#fff;}
/* .adro-address ~ .adro-actions {background:#EEF0F2;width:100%} */

/*  */
.adro-summary {background:#EEF0F2;}
.adro-summary .adro-header {background:none;}
.adro-summary .adro-component {background-color:#fff;}
.adro-summary .page-summary {background:none;}
.adro-summary .page-body {padding-top:.5rem}
.adro-summary .section ~ .section {margin-top:.5rem;}
.adro-summary .product-group .product-meta {margin-top:8px}
.adro-summary .product-group:last-child {padding-bottom:0}
.adro-summary .section-header {padding-bottom:1rem}

/*  */
.adro-manager .content-info .info-row  {gap:24px}

/*  */
.product-group {padding:1rem 0 1.5rem;margin:0 1rem;border-top:1px solid var(--border-color)}
.product-group-header {margin-bottom:24px}
.product-group-title {font-size:12px}
.product-group .product-list {}
.product-group .product {position:relative;display:flex;gap:12px}
.product-group .product ~ .product {margin-top:24px}
.product-group .product-image {flex:0 0 48px;width:48px;height:48px;overflow:hidden;border-radius:8px;}
.product-group .product-image > img {width:100%;height:100%;object-fit:cover;}
.product-group .product-info {position:relative;flex:1 1 0}
.product-group .product-title {font-size:15px}
.product-group .product-tags {margin-top:8px;}
.product-group .product-price {display:flex;font-size:15px;gap:4px}
.product-group .product-price .original-price {}
.product-group .product-price .discounted-price {font-weight:600}
.product-group .product-status {margin-top:4px;display:flex;gap:4px;align-items:center;}
.product-group .product-status .status-indicator {width:12px;height:12px;border-radius:6px;}
.product-group .product-status .status-text {font-size:12px;color:var(--secondary-color)}
.product-group .product-quantity.form-quantity {margin-left:auto}
.product-group .product-meta {margin-top:1rem;display:flex;gap:8px;align-items:center;}

.product-group-min {margin:0;border-top:0;padding-top:0}
.product-group-min .product ~ .product {margin-top:1rem}
.product-group-min .product-group-header {margin-bottom:1rem}

.adro-order .product-category .category.is-active .category-body {max-height:fit-content}

/*  */
.section {}
.section ~ .section {margin-top:1rem}
.section-header {padding:8px 0}
.section-header-min {padding:0}
.section-header-min > .section-title-sm {padding:0 8px 4px}
.section-title {font-size:18px;font-weight:600}
.section-title-sm {font-size:15px;font-weight:400}
.section-body {}

/*  */
.tabs {display:flex;justify-content:center;margin-bottom:24px}
.tabs .tab-wrapper {display:flex;width:100%;height:42px;border-radius:12px;padding:4px;background-color:rgba(0, 0, 0, 0.05);}
.tabs .tab {flex:1 1 0;display:flex;align-items:center;justify-content:center;border-radius:8px;font-size:14px;font-weight:600;color:var(--secondary-color)}
.tabs .tab.is-active {background-color:#fff;box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);color:var(--body-color)}
.tab-panel {display:none}
.tab-panel.is-active {display:block}

/*  */
.tags {display:flex;flex-wrap:wrap;gap:4px;}
.tag {display:flex;align-items:center;padding:4px 8px;font-size:12px;color:var(--secondary-color);background-color:var(--bg-light);border-radius:999rem}

/*  */
.section-address {}
.section-address .content-card-list {margin-top:8px}

/*  */
.adro-popup {position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;display:flex;opacity:0;transition:opacity .2s;z-index:-1;pointer-events:none;}
.adro-popup.is-active {opacity:1;pointer-events:auto;z-index:1100}
.adro-popup .popup {margin:auto;border-radius:1rem;background-color:#fff;;z-index:1;width:100%;min-width:320px;max-width:400px;}
.adro-popup .popup-lg {max-width: 600px;}
.adro-popup .popup-header {padding:24px 24px 0}
.adro-popup .popup-title {font-size:18px;font-weight:600;text-align:center;}
.adro-popup .popup-body {padding:24px}
.adro-popup .popup-actions{display:flex;padding:1rem;gap:8px;}
.adro-popup .popup-action-item {flex:1 1 100%}
.adro-popup .popup-overlay {position:fixed;left:0;top:0;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.4);}
.adro-popup .popup-info {}
.adro-popup .popup-info ~ .popup-info {margin-top:1rem;}
.adro-popup .popup-info .info-label {display:block;margin-bottom:.8px}
.adro-popup .popup-info .info-content{}

.adro-alert {position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;display:flex;}
.adro-alert .alert {margin:auto;padding:24px 24px 0;border-radius:1rem;background-color:#fff;z-index:1;width:320px;text-align:center;}
.adro-alert .alert-header {margin-bottom:8px}
.adro-alert .alert-header .header-title {font-size:18px;font-weight:600}
.adro-alert .alert-body {padding-bottom:1rem}
.adro-alert .alert-text {font-size:15px;}
.adro-alert .alert-actions {display:flex;gap:8px;}
.adro-alert .alert-action-item {flex:1 1 100%;display:flex;align-items:center;justify-content:center;height:59px;}
.adro-alert .alert-overlay {position:fixed;left:0;top:0;width:100%;height:100%;background-color:rgba(0, 0, 0, 0.4);}

/*  */
.adro-login {position:relative}
.adro-login .login-container {position:relative;z-index:1;display:flex;flex-direction:column;height:100%;padding:0 24px clamp(45px,12.2vw,160px);;align-items:center;}
.adro-login .login-background {position:absolute;left:0;top:0;width:100%;height:100%;}
.adro-login .login-background img,
.adro-login .login-background video,
.adro-login .login-background picture {width:100%;height:100%;object-fit:cover;}
.adro-login .login-header {margin-top:120px;margin-bottom:120px;display:flex;align-items:center;flex-direction:column;gap:1rem;color:#fff;}
.adro-login .login-logo {display:block;width:136px;height:48px;background:url(../images/h1_logo.svg) no-repeat center center;}
.adro-login .login-forms {margin:0 auto;width:min(100%, 400px);border-radius:1rem;padding:24px 1rem;backdrop-filter: blur(60px);background-color:rgba(255, 255, 255, 0.1);}
.adro-login .form-label {color:#fff;}
.adro-login .form-description {color:var(--secondary-color);font-size:12px;text-align:left;}
.adro-login .form-input {--input-bg:rgba(255, 255, 255, 0.1);--input-color:#fff}
.adro-login .form-input::placeholder {--input-placeholder-color:rgba(255, 255, 255, 0.4);}
.adro-login .form-input:focus {--input-focus-bg:rgba(255, 255, 255, 0.1);box-shadow:inset 0 0 0 1px #fff;--input-focus-color:#fff}
.adro-login .login-title {}
.adro-login .login-subtitle {}
.adro-login .form-info {margin-top:24px;}
.adro-login .form-info .info-text {padding-top:8px;color:var(--secondary-color);font-size:12px;text-align:center;}
.adro-login .form-info .info-link {text-decoration:underline; text-underline-offset:2px;transition:var(--transition)}
.adro-login .form-info .info-link:hover {color:#fff;;}
.adro-login .form-info br {display:block}

@media (min-width: 768px ) {
    .adro-container:not(.adro-summary) .product-group-min .product-meta {margin-top:0;position:absolute;right:0;top:50%;transform:translateY(-50%);}
    .adro-login .login-container {}
}

@media (min-width: 1024px ) {
    .adro-login .form-info br {display:none}
    .adro-login .login-container {padding-bottom:68px;}
}