/* ============================================================
   Orivelle base: scoped reset + primitives inside .orivelle-store
   (never leaks to the theme — every rule is namespaced)
   ============================================================ */

.orivelle-store,
.orivelle-store * { box-sizing: border-box; }

.orivelle-store {
    font-family: var(--ov-font-body);
    font-size: var(--ov-font-size);
    line-height: var(--ov-line-height);
    letter-spacing: var(--ov-letter-spacing);
    color: var(--ov-text);
    background: var(--ov-bg);
    -webkit-font-smoothing: antialiased;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
.orivelle-store .ov-main { flex: 1 0 auto; }

.orivelle-store h1, .orivelle-store h2, .orivelle-store h3,
.orivelle-store h4, .orivelle-store h5 {
    font-family: var(--ov-font-heading);
    color: var(--ov-text);
    line-height: 1.2;
    margin: 0 0 .5em;
    font-weight: 700;
}
.orivelle-store h1 { font-size: clamp(1.9rem, 4vw, 2.6rem); }
.orivelle-store h2 { font-size: clamp(1.4rem, 3vw, 1.9rem); }
.orivelle-store h3 { font-size: 1.2rem; }
.orivelle-store h4 { font-size: 1.05rem; }
.orivelle-store p { margin: 0 0 1em; }
.orivelle-store a { color: var(--ov-primary); text-decoration: none; transition: color var(--ov-tr-fast); }
.orivelle-store a:hover { color: var(--ov-btn-hover); }
.orivelle-store img { max-width: 100%; height: auto; display: block; }
.orivelle-store ul, .orivelle-store ol { padding-left: 1.25em; margin: 0 0 1em; }
.orivelle-store button { font: inherit; cursor: pointer; }
.orivelle-store fieldset { border: 0; margin: 0 0 24px; padding: 0; }
.orivelle-store legend { font-weight: 700; margin-bottom: 12px; font-family: var(--ov-font-heading); font-size: 1.05rem; }
.orivelle-store address { font-style: normal; }
.orivelle-store figure { margin: 0; }

/* ---------- layout ---------- */
.orivelle-store .ov-container { width: 100%; max-width: var(--ov-container); margin-inline: auto; padding-inline: 20px; }
.orivelle-store .ov-container--narrow { max-width: 780px; }
.orivelle-store .ov-page-title { margin: 26px 0 22px; }
.orivelle-store .ov-sec { padding: 44px 0; }
.orivelle-store .ov-sec--surface { background: var(--ov-surface); }
.orivelle-store .ov-sec__head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.orivelle-store .ov-sec__head h2 { margin: 0; }
.orivelle-store .ov-sec__link { font-weight: 600; white-space: nowrap; }

/* ---------- buttons ---------- */
.orivelle-store .ov-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    background: var(--ov-btn); color: #fff; border: 0; border-radius: var(--ov-radius);
    padding: 11px 22px; font-weight: 600; font-size: .95rem; line-height: 1.4;
    transition: background var(--ov-tr-fast), transform var(--ov-tr-fast), box-shadow var(--ov-tr-fast);
    text-decoration: none; white-space: nowrap;
}
.orivelle-store .ov-btn:hover { background: var(--ov-btn-hover); color: #fff; transform: translateY(-1px); box-shadow: var(--ov-shadow-sm); }
.orivelle-store .ov-btn:active { transform: translateY(0); }
.orivelle-store .ov-btn--lg { padding: 14px 30px; font-size: 1.02rem; }
.orivelle-store .ov-btn--sm { padding: 7px 14px; font-size: .85rem; }
.orivelle-store .ov-btn--block { width: 100%; }
.orivelle-store .ov-btn--outline { background: transparent; color: var(--ov-text); border: 1.5px solid var(--ov-border); }
.orivelle-store .ov-btn--outline:hover { border-color: var(--ov-primary); color: var(--ov-primary); background: transparent; }
.orivelle-store .ov-btn--ghost { background: transparent; color: var(--ov-text); }
.orivelle-store .ov-btn--ghost:hover { background: var(--ov-surface); color: var(--ov-text); box-shadow: none; }
.orivelle-store .ov-btn--light { background: #fff; color: var(--ov-text); }
.orivelle-store .ov-btn--light:hover { background: var(--ov-surface); color: var(--ov-text); }
.orivelle-store .ov-btn--accent { background: var(--ov-accent); }
.orivelle-store .ov-btn--accent:hover { filter: brightness(.94); background: var(--ov-accent); }
.orivelle-store .ov-btn--danger { background: var(--ov-error); }
.orivelle-store .ov-btn--disabled, .orivelle-store .ov-btn:disabled { background: var(--ov-border); color: var(--ov-muted); cursor: not-allowed; transform: none; box-shadow: none; }
.orivelle-store .ov-btn--cart { background: var(--ov-btn); }
.orivelle-store .ov-btn--cart b { background: rgba(255,255,255,.25); border-radius: 99px; padding: 0 8px; font-weight: 700; }
.orivelle-store .ov-btn__spinner { width: 16px; height: 16px; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; border-radius: 50%; animation: ov-spin .7s linear infinite; }
.orivelle-store .ov-linkbtn { background: none; border: 0; color: var(--ov-muted); display: inline-flex; align-items: center; gap: 6px; padding: 4px 0; font-size: .9rem; }
.orivelle-store .ov-linkbtn:hover, .orivelle-store .ov-linkbtn.active { color: var(--ov-primary); }
.orivelle-store .ov-link { font-size: .9rem; font-weight: 600; }
.orivelle-store .ov-danger { color: var(--ov-error); }

/* ---------- icon buttons ---------- */
.orivelle-store .ov-iconbtn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 40px; height: 40px; border-radius: var(--ov-radius); border: 0;
    background: transparent; color: var(--ov-text); position: relative;
    transition: background var(--ov-tr-fast);
}
.orivelle-store .ov-iconbtn:hover { background: var(--ov-surface); }
.orivelle-store .ov-iconbtn svg { width: 20px; height: 20px; }
.orivelle-store .ov-iconbtn--label { flex-direction: column; width: auto; height: auto; gap: 2px; font-size: .68rem; color: var(--ov-muted); }
.orivelle-store .ov-iconbtn--label span { font-weight: 600; }
.orivelle-store .ov-count, .orivelle-store .ov-cart-count {
    position: absolute; top: 2px; right: 0; min-width: 17px; height: 17px; padding: 0 4px;
    background: var(--ov-primary); color: #fff; border-radius: 99px;
    font-size: .65rem; font-weight: 700; line-height: 17px; text-align: center; font-style: normal;
}
.orivelle-store .ov-iconbtn--label .ov-count { position: static; margin-left: 2px; display: inline-block; }

/* ---------- forms ---------- */
.orivelle-store .ov-input {
    width: 100%; padding: 11px 14px; border: 1.5px solid var(--ov-border);
    border-radius: var(--ov-radius); background: var(--ov-bg); color: var(--ov-text);
    font: inherit; transition: border-color var(--ov-tr-fast), box-shadow var(--ov-tr-fast);
}
.orivelle-store .ov-input:focus { outline: 0; border-color: var(--ov-primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ov-primary) 15%, transparent); }
.orivelle-store .ov-input--xs { width: 76px; padding: 5px 8px; }
.orivelle-store textarea.ov-input { resize: vertical; }
.orivelle-store select.ov-input { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.4'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; padding-right: 34px; }
.orivelle-store .ov-field { margin-bottom: 14px; }
.orivelle-store .ov-field__label { display: block; font-weight: 600; font-size: .88rem; margin-bottom: 6px; }
.orivelle-store .ov-field__help { font-size: .82rem; color: var(--ov-muted); margin: 6px 0 0; }
.orivelle-store .ov-fieldrow { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.orivelle-store .ov-fieldrow:has(> :nth-child(3)) { grid-template-columns: repeat(3, 1fr); }
.orivelle-store .ov-check { display: flex; align-items: center; gap: 9px; padding: 5px 0; font-size: .92rem; cursor: pointer; }
.orivelle-store .ov-check input { accent-color: var(--ov-primary); width: 16px; height: 16px; }
.orivelle-store .ov-check em { color: var(--ov-muted); font-style: normal; font-size: .82rem; }

/* ---------- qty stepper ---------- */
.orivelle-store .ov-qty { display: inline-flex; align-items: stretch; border: 1.5px solid var(--ov-border); border-radius: var(--ov-radius); overflow: hidden; }
.orivelle-store .ov-qty button { width: 36px; border: 0; background: var(--ov-surface); color: var(--ov-text); display: grid; place-items: center; }
.orivelle-store .ov-qty button:hover { background: var(--ov-border); }
.orivelle-store .ov-qty input { width: 52px; border: 0; text-align: center; font-weight: 600; padding: 9px 4px; background: var(--ov-bg); color: var(--ov-text); }
.orivelle-store .ov-qty input::-webkit-inner-spin-button { display: none; }

/* ---------- badges / pills / stars ---------- */
.orivelle-store .ov-badge { display: inline-block; padding: 3px 9px; border-radius: 99px; font-size: .72rem; font-weight: 700; letter-spacing: .02em; }
.orivelle-store .ov-badge--sale { background: var(--ov-sale); color: #fff; }
.orivelle-store .ov-badge--new { background: var(--ov-accent); color: #fff; }
.orivelle-store .ov-badge--featured { background: var(--ov-secondary); color: #fff; }
.orivelle-store .ov-badge--out { background: var(--ov-muted); color: #fff; }
.orivelle-store .ov-badge--error { background: var(--ov-error); color: #fff; }
.orivelle-store .ov-pill { display: inline-block; padding: 2px 10px; border-radius: 99px; font-size: .75rem; font-weight: 600; background: var(--ov-surface); color: var(--ov-muted); }
.orivelle-store .ov-pill--accent { background: color-mix(in srgb, var(--ov-primary) 12%, transparent); color: var(--ov-primary); }
.orivelle-store .ov-pill--muted { opacity: .7; }
.orivelle-store .ov-stars { display: inline-flex; gap: 2px; color: #f59e0b; font-size: .95rem; letter-spacing: .05em; align-items: center; }
.orivelle-store .ov-stars .empty { color: var(--ov-border); }
.orivelle-store .ov-stars .ov-star { width: 15px; height: 15px; fill: var(--ov-border); stroke: none; }
.orivelle-store .ov-stars .ov-star.on { fill: #f59e0b; }
.orivelle-store .ov-stars .ov-star.half { fill: #f59e0b; opacity: .5; }
.orivelle-store .ov-stars-count { color: var(--ov-muted); font-size: .8rem; margin-left: 4px; }
.orivelle-store .ov-ship-progress { margin-bottom: 12px; }
.orivelle-store .ov-progress { height: 8px; background: var(--ov-border); border-radius: 99px; overflow: hidden; }
.orivelle-store .ov-progress__bar { height: 100%; background: linear-gradient(90deg, var(--ov-primary), var(--ov-accent)); border-radius: 99px; transition: width .4s; }
.orivelle-store .ov-icon { flex-shrink: 0; }

/* ---------- notices / empty states / skeletons ---------- */
.orivelle-store .ov-notice { padding: 13px 16px; border-radius: var(--ov-radius); background: var(--ov-surface); border-left: 3px solid var(--ov-primary); margin: 14px 0; }
.orivelle-store .ov-notice--error { border-left-color: var(--ov-error); background: color-mix(in srgb, var(--ov-error) 7%, var(--ov-bg)); }
.orivelle-store .ov-notice--success { border-left-color: var(--ov-success); background: color-mix(in srgb, var(--ov-success) 7%, var(--ov-bg)); }
.orivelle-store .ov-empty { text-align: center; padding: 56px 20px; }
.orivelle-store .ov-empty__icon { font-size: 2.6rem; margin-bottom: 10px; opacity: .5; }
.orivelle-store .ov-empty h3 { margin-bottom: 6px; }
.orivelle-store .ov-empty p { color: var(--ov-muted); margin-bottom: 18px; }
.orivelle-store .ov-skeleton { border-radius: var(--ov-radius); background: linear-gradient(90deg, var(--ov-surface) 25%, var(--ov-border) 50%, var(--ov-surface) 75%); background-size: 200% 100%; animation: ov-shimmer 1.3s infinite; min-height: 90px; }

/* ---------- cards / summary box ---------- */
.orivelle-store .ov-card, .orivelle-store .ov-summary {
    background: var(--ov-bg); border: 1px solid var(--ov-border);
    border-radius: var(--ov-radius-lg); padding: 22px; box-shadow: var(--ov-shadow-xs);
}
.orivelle-store .ov-summary h3 { margin-top: 0; }

/* ---------- totals table ---------- */
.orivelle-store .ov-totals { margin: 14px 0; }
.orivelle-store .ov-totals > div { display: flex; justify-content: space-between; padding: 7px 0; border-bottom: 1px dashed var(--ov-border); }
.orivelle-store .ov-totals dt { color: var(--ov-muted); }
.orivelle-store .ov-totals dd { margin: 0; font-weight: 600; }
.orivelle-store .ov-totals .ov-ok dd, .orivelle-store .ov-totals .ov-ok dt { color: var(--ov-success); }
.orivelle-store .ov-totals__grand { border-bottom: 0; font-size: 1.15rem; padding-top: 12px; }
.orivelle-store .ov-totals__grand dd { color: var(--ov-primary); font-size: 1.3rem; }

/* ---------- tables ---------- */
.orivelle-store .ov-table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.orivelle-store .ov-table th { text-align: left; padding: 10px 12px; border-bottom: 2px solid var(--ov-border); font-weight: 700; color: var(--ov-muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; }
.orivelle-store .ov-table td { padding: 12px; border-bottom: 1px solid var(--ov-border); vertical-align: middle; }

/* ---------- breadcrumb ---------- */
.orivelle-store .ov-crumbs { display: flex; gap: 8px; font-size: .85rem; color: var(--ov-muted); margin: 18px 0; flex-wrap: wrap; }
.orivelle-store .ov-crumbs a { color: var(--ov-muted); }
.orivelle-store .ov-crumbs a:hover { color: var(--ov-primary); }
.orivelle-store .ov-crumbs span:last-child { color: var(--ov-text); font-weight: 600; }
.orivelle-store .ov-crumbs i { font-style: normal; opacity: .5; }

/* ---------- accordion / tabs ---------- */
.orivelle-store .ov-acc { border: 1px solid var(--ov-border); border-radius: var(--ov-radius); margin-bottom: 10px; overflow: hidden; }
.orivelle-store .ov-acc summary { list-style: none; padding: 15px 18px; font-weight: 600; cursor: pointer; display: flex; justify-content: space-between; align-items: center; }
.orivelle-store .ov-acc summary::-webkit-details-marker { display: none; }
.orivelle-store .ov-acc__ic { transition: transform var(--ov-tr); color: var(--ov-muted); }
.orivelle-store .ov-acc[open] .ov-acc__ic { transform: rotate(180deg); }
.orivelle-store .ov-acc__body { padding: 0 18px 16px; color: var(--ov-muted); }
.orivelle-store .ov-tabs__nav { display: flex; gap: 4px; border-bottom: 2px solid var(--ov-border); margin-bottom: 20px; flex-wrap: wrap; }
.orivelle-store .ov-tabs__tab { border: 0; background: none; padding: 11px 18px; font-weight: 600; color: var(--ov-muted); border-bottom: 2.5px solid transparent; margin-bottom: -2px; }
.orivelle-store .ov-tabs__tab.cur { color: var(--ov-primary); border-bottom-color: var(--ov-primary); }
.orivelle-store .ov-tabs__panel { display: none; }
.orivelle-store .ov-tabs__panel.cur { display: block; }

/* ---------- animations ---------- */
@keyframes ov-spin { to { transform: rotate(360deg); } }
@keyframes ov-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
@keyframes ov-fadeup { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes ov-slidein { from { transform: translateX(100%); } to { transform: none; } }
.orivelle-store .ov-anim-in { animation: ov-fadeup .45s cubic-bezier(.2,.7,.3,1) both; }

/* ---------- toast / drawer / modal roots ---------- */
.ov-toast-region { position: fixed; bottom: 20px; right: 20px; z-index: 99999; display: flex; flex-direction: column; gap: 10px; }
.ov-toast { background: var(--ov-text, #0f172a); color: #fff; padding: 13px 18px; border-radius: 10px; box-shadow: 0 12px 32px rgba(0,0,0,.25); display: flex; align-items: center; gap: 10px; font-size: .92rem; animation: ov-fadeup .3s ease both; max-width: 340px; }
.ov-toast--success { border-left: 3px solid #22c55e; }
.ov-toast--error { border-left: 3px solid #ef4444; }
.ov-toast a { color: #a5f3fc; font-weight: 600; }
.ov-drawer { position: fixed; inset: 0; z-index: 99990; }
.ov-drawer__overlay { position: absolute; inset: 0; background: rgba(10,15,30,.5); backdrop-filter: blur(2px); animation: ov-fadeup .2s ease both; }
.ov-drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(430px, 94vw); background: var(--ov-bg, #fff); color: var(--ov-text, #0f172a); box-shadow: -16px 0 48px rgba(0,0,0,.2); display: flex; flex-direction: column; animation: ov-slidein .3s cubic-bezier(.2,.7,.3,1) both; font-family: var(--ov-font-body, system-ui); }
.ov-drawer__panel--left { right: auto; left: 0; animation-name: ov-slidein-l; box-shadow: 16px 0 48px rgba(0,0,0,.2); }
@keyframes ov-slidein-l { from { transform: translateX(-100%); } to { transform: none; } }
.ov-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid var(--ov-border, #e2e8f0); font-weight: 700; }
.ov-drawer__body { flex: 1; overflow-y: auto; padding: 16px 20px; }
.ov-drawer__foot { padding: 16px 20px; border-top: 1px solid var(--ov-border, #e2e8f0); }
.ov-modal { position: fixed; inset: 0; z-index: 99995; display: grid; place-items: center; padding: 20px; }
.ov-modal__overlay { position: absolute; inset: 0; background: rgba(10,15,30,.55); backdrop-filter: blur(3px); }
.ov-modal__card { position: relative; background: var(--ov-bg, #fff); color: var(--ov-text, #0f172a); border-radius: 16px; padding: 28px; width: min(460px, 100%); box-shadow: 0 32px 80px rgba(0,0,0,.3); animation: ov-fadeup .3s ease both; font-family: var(--ov-font-body, system-ui); }
.ov-close { position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; border-radius: 50%; border: 0; background: var(--ov-surface, #f1f5f9); display: grid; place-items: center; color: var(--ov-text, #0f172a); }

/* ---------- utility ---------- */
.orivelle-store .ov-ok { color: var(--ov-success); }
.orivelle-store .ov-err { color: var(--ov-error); }
.orivelle-store .ov-prose p { color: color-mix(in srgb, var(--ov-text) 85%, transparent); }
.orivelle-store .ov-prose h2 { margin-top: 1.4em; }
.orivelle-store .ov-updated { color: var(--ov-muted); font-size: .85rem; }
.orivelle-store .ov-lead { font-size: 1.15rem; color: var(--ov-muted); }
.orivelle-store .ov-thumb { width: 48px; height: 48px; object-fit: cover; border-radius: 8px; }

@media (max-width: 860px) {
    .orivelle-store .ov-fieldrow { grid-template-columns: 1fr; }
    .orivelle-store .ov-fieldrow:has(> :nth-child(3)) { grid-template-columns: 1fr; }
    .orivelle-store .ov-sec { padding: 30px 0; }
}