/* Voucher / offer cards and the code popup: discount.ro's layout and behaviour (measured on discount.ro 2026-11-12) in
   the new site's own style (borders, colours, radius, type), namespaced .dv-*. Markup: server/views/voucher.mjs. */
.dv-list{display:flex;flex-direction:column;gap:12px}
/* discount.ro's card layout, in the site's own style (owner 2026-11-12): 20px corners, #E3E6EA border, navy text,
   the orange accent; the code button keeps discount.ro's tab with the folded corner */
.dv{display:block;border:1px solid #E3E6EA;border-radius:20px;background:#FFFFFF;color:#0E1A2B;text-decoration:none;font-family:Inter,system-ui,sans-serif;transition:border-color .15s,box-shadow .15s}
.dv:hover{color:#0E1A2B;border-color:#0E1A2B;box-shadow:0 2px 12px rgba(14,26,43,.08)}
.dv-row{display:flex;flex-wrap:wrap;align-items:center;cursor:pointer;overflow:hidden;border-radius:20px}
.dv-row *{box-sizing:border-box}
.dv-sum{display:block;width:16.6667%;padding:.7rem 1rem;text-align:center;color:#C2410C;font-family:Archivo,Inter,sans-serif;font-size:32px;font-weight:800;line-height:1.2;overflow:hidden;overflow-wrap:anywhere}
.dv-sum svg{display:inline-block;vertical-align:middle}
.dv-imgwrap{width:16.6667%;padding:.7rem;text-align:center}
.dv-imgwrap img{display:block;max-width:100%;height:auto;border-radius:12px;margin:0 auto}
.dv-pill{border:1.5px solid #C2410C;color:#C2410C;border-radius:999px;margin-top:6px;padding:3px 6px;font-weight:700;text-align:center;font-size:14px;line-height:1.5}
.dv-body{width:83.3333%;padding:0;display:flex;flex-wrap:wrap;align-items:center}
.dv-desc{width:66.6667%;padding:1em}
.dv-code{width:33.3333%;padding:1em}
.dv-status{display:flex;flex-wrap:wrap;align-items:center;font-size:12px;color:#C2410C;margin-bottom:.5rem}
.dv-status b{line-height:24px;font-weight:700;letter-spacing:.02em;text-transform:uppercase}
.dv-verf{position:relative;margin:0 .3rem 0 .5rem}
.dv-verf path{fill:#065F46}
.dv-ok{color:#065F46;font-size:12px;line-height:24px}
.dv-ok b{text-transform:none;letter-spacing:0}
.dv-exp{color:#3B4656;margin:0 .5rem;font-size:12px;line-height:24px}
.dv-tline{display:flex;flex-wrap:wrap}
.dv-title{font-size:16px;font-weight:600;line-height:24px;color:#0E1A2B}
/* "Afișează COD": discount.ro's tab with the folded corner, in the site's orange; the code's last characters on the right */
.dv-getcode{position:relative;display:block;width:100%;height:48px;border-radius:999px;border:1px solid #E3E6EA;background:#FFFFFF;color:#0E1A2B;font-size:16px;font-weight:700;text-align:right;padding:10px 14px 10px 18px;line-height:26px;-webkit-font-smoothing:antialiased}
.dv-getcode::before{content:"";position:absolute;top:0;left:0;width:76%;height:100%;background-color:#C2410C;border-top-left-radius:999px;border-bottom-left-radius:999px;transition:width .2s ease-out;z-index:1}
.dv-getcode::after{content:"";position:absolute;top:0;left:76%;width:0;height:0;border-style:solid;border-width:48px 0 0 35px;transform:rotate(17deg);border-color:transparent transparent transparent #9A3412;transition:left .2s ease-out;transform-origin:left top;z-index:1;display:block}
.dv-getcode>span{position:absolute;left:10%;z-index:2;color:#FFFFFF;font-size:16px;line-height:26px}
.dv:hover .dv-getcode::before{width:67%}
.dv:hover .dv-getcode::after{left:67%}
/* "Vezi Promotie": the site's main button */
.dv-promo{display:flex;align-items:center;justify-content:center;width:100%;height:48px;border-radius:999px;background:#C2410C;color:#FFFFFF;font-weight:700;font-size:16px;text-align:center;transition:background-color .15s;-webkit-font-smoothing:antialiased}
.dv:hover .dv-promo{background:#9A3412}
@media screen and (max-width:768px){
  .dv-sum,.dv-imgwrap{width:33.3333%;padding:.5rem}
  .dv-body{width:66.6667%;padding:.5rem}
  .dv-desc,.dv-code{width:100%;padding:10px 0}
  .dv-desc{padding:10px 0 0}
  .dv-title{font-weight:600;font-size:16px}
}

/* ---- the code popup (#voucher-<id>) ---- */
/* ---- the coupon window (voucher.js popup): a centred dialog on desktop, a sheet from the bottom on phones ---- */
.dv-noscroll{overflow:hidden}
.dv-pop{position:fixed;inset:0;z-index:999;display:flex;align-items:center;justify-content:center;padding:16px;font-family:Inter,system-ui,sans-serif;color:#0E1A2B}
.dv-pop *{box-sizing:border-box}
.dv-pop .dv-backdrop{position:absolute;inset:0;background:rgba(14,26,43,.6);animation:dv-fade .16s ease-out}
.dv-pop .dv-box{position:relative;width:100%;max-width:460px;padding:28px 28px 22px;background:#FFFFFF;border-radius:24px;box-shadow:0 24px 60px rgba(14,26,43,.28);animation:dv-up .18s ease-out}
.dv-pop .dv-close{position:absolute;top:10px;right:10px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:0;border-radius:999px;background:transparent;color:#3B4656;cursor:pointer}
.dv-pop .dv-close:hover{background:#F1F3F5;color:#0E1A2B}
.dv-pop .dv-head{display:flex;align-items:center;gap:14px;padding-right:36px}
.dv-pop .dv-logo{flex:none;width:56px;height:56px;border-radius:14px;border:1px solid #E3E6EA;background:#FFFFFF;object-fit:contain}
.dv-pop .dv-mono{display:flex;align-items:center;justify-content:center;background:#F1F3F5;font-weight:700;font-size:20px}
.dv-pop .dv-shop{margin:0 0 2px;font-size:13px;line-height:18px;color:#5B6675;overflow-wrap:anywhere}
.dv-pop h2{margin:0;font-family:Archivo,Inter,sans-serif;font-weight:800;font-size:19px;line-height:25px;letter-spacing:-.01em}
.dv-pop .dv-meta{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0}
.dv-pop .dv-chip{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;background:#F1F3F5;font-size:12px;font-weight:600;color:#3B4656}
.dv-pop .dv-chip-ok{background:#E3F5EC;color:#065F46}
.dv-pop .dv-field{display:flex;align-items:stretch;gap:0;margin-top:18px;border:2px dashed #C2410C;border-radius:16px;background:#FFF7F2;overflow:hidden}
.dv-pop .dv-thecode{flex:1 1 auto;min-width:0;display:flex;align-items:center;justify-content:center;padding:12px 14px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-weight:700;font-size:22px;line-height:28px;letter-spacing:.04em;overflow-wrap:anywhere;text-align:center;cursor:pointer;user-select:all}
.dv-pop .dv-copy{flex:none;min-width:132px;min-height:52px;padding:0 18px;border:0;background:#C2410C;color:#FFFFFF;font:inherit;font-size:15px;font-weight:700;cursor:pointer}
.dv-pop .dv-copy:hover{background:#9A3412}
.dv-pop .dv-copy.ok{background:#047857}
.dv-pop .dv-live{min-height:18px;margin:6px 0 0;font-size:13px;line-height:18px;color:#065F46;text-align:center}
.dv-pop .dv-steps{margin:8px 0 0;padding:0 0 0 20px;font-size:14px;line-height:22px;color:#3B4656}
.dv-pop .dv-nocode{margin:18px 0 0;padding:14px 16px;border-radius:14px;background:#F4F5F7;font-size:15px;line-height:23px;color:#3B4656}
.dv-pop .dv-nocode strong{color:#0E1A2B}
.dv-pop .dv-go{display:flex;align-items:center;justify-content:center;gap:8px;min-height:52px;margin-top:18px;border-radius:999px;background:#0E1A2B;color:#FFFFFF;font-size:16px;font-weight:700;text-decoration:none}
.dv-pop .dv-go:hover{background:#000000;color:#FFFFFF}
.dv-pop .dv-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.dv-pop .dv-nl{margin:22px -28px -22px;padding:18px 28px 20px;border-top:1px solid #E3E6EA;border-radius:0 0 24px 24px;background:#F8F9FA}
.dv-pop .dv-nl label{display:block;margin-bottom:8px;font-size:14px;font-weight:600;color:#0E1A2B}
.dv-pop .dv-nl-row{display:flex;gap:8px}
.dv-pop .dv-nl input[type=email]{flex:1 1 auto;min-width:0;height:44px;padding:0 14px;border:1px solid #C9CFD6;border-radius:12px;background:#FFFFFF;font:inherit;font-size:16px;color:#0E1A2B}
.dv-pop .dv-nl input[type=email]:focus{outline:2px solid #0E1A2B;outline-offset:1px;border-color:#0E1A2B}
.dv-pop .dv-nl button{flex:none;height:44px;padding:0 16px;border:1px solid #0E1A2B;border-radius:12px;background:#FFFFFF;color:#0E1A2B;font:inherit;font-size:14px;font-weight:700;cursor:pointer}
.dv-pop .dv-nl button:hover{background:#0E1A2B;color:#FFFFFF}
.dv-pop .dv-secure{display:flex;align-items:center;gap:6px;margin:10px 0 0;font-size:12px;line-height:16px;color:#5B6675}
.dv-pop .dv-secure svg{flex:none;color:#047857}
.dv-pop :focus-visible{outline:2px solid #0E1A2B;outline-offset:2px}
.dv-pop .dv-copy:focus-visible,.dv-pop .dv-go:focus-visible{outline-color:#F59E0B}
@keyframes dv-fade{from{opacity:0}}
@keyframes dv-up{from{opacity:0;transform:translateY(12px)}}
@media (max-width:600px){
  .dv-pop{align-items:flex-end;padding:0}
  .dv-pop .dv-box{max-width:none;max-height:92vh;overflow-y:auto;overscroll-behavior:contain;padding:24px 18px 18px;border-radius:24px 24px 0 0}
  .dv-pop .dv-nl{margin:20px -18px -18px;padding:16px 18px calc(18px + env(safe-area-inset-bottom,0px));border-radius:0}
  .dv-pop .dv-field{flex-direction:column}
  .dv-pop .dv-copy{width:100%}
  .dv-pop .dv-nl-row{flex-direction:column}
  .dv-pop .dv-nl button{width:100%}
}
@media (prefers-reduced-motion:reduce){.dv-pop .dv-backdrop,.dv-pop .dv-box{animation:none}}
