/* Remindere de ocazii (views/reminders.php) - aceleasi variabile ca hub-ul contului (css/cont.css); totul scoped pe .sg-rem */
.sg-rem{--hub-ink:#1d2b33;--hub-ink2:#54656f;--hub-line:#dfe8ea;--hub-teal:#64cad0;--hub-teal-deep:#1f8f97;--hub-teal-soft:#e3f5f6;--hub-green:#7cb342;--hub-red:#d9534f;--hub-pink:#fde8ee;--hub-r:14px;--hub-shadow:0 10px 30px rgba(31,80,90,.12);color:var(--hub-ink);font-size:15px;line-height:1.5;background:#f6f9f9}
.sg-rem h1,.sg-rem h2,.sg-rem h3{font-family:'AvenirNext LT Pro','Open Sans',Arial,sans-serif;color:var(--hub-ink);text-transform:none;letter-spacing:0;margin:0;line-height:1.2}
.sg-rem a{color:var(--hub-teal-deep)}
.sg-rem a:hover{text-decoration:none;color:var(--hub-ink)}
.sg-rem .rem-page{padding:26px 15px 60px}
.sg-rem .rem-center{text-align:center;margin:18px 0}

/* butoane */
.sg-rem .rem-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:10px;font-weight:700;font-size:14px;border:2px solid transparent;cursor:pointer;line-height:1.2;text-transform:none;letter-spacing:0;transition:background .15s,border-color .15s;text-decoration:none}
.sg-rem .rem-btn.primary{background:var(--hub-green);color:#fff;box-shadow:0 6px 18px rgba(124,179,66,.3)}
.sg-rem .rem-btn.primary:hover{background:#6ca236;color:#fff}
.sg-rem .rem-btn.ghost{background:#fff;border-color:var(--hub-line);color:var(--hub-ink)}
.sg-rem .rem-btn.ghost:hover{border-color:var(--hub-teal);color:var(--hub-teal-deep)}
.sg-rem .rem-btn.sm{padding:8px 16px;font-size:13px}
.sg-rem .rem-btn.rem-full{width:100%}
.sg-rem .rem-btn[disabled]{opacity:.6;cursor:default}

/* hero */
.sg-rem .rem-hero{background:#fff;border-bottom:1px solid var(--hub-line)}
.sg-rem .rem-hero-inner{display:flex;align-items:center;gap:28px;padding:34px 15px}
.sg-rem .rem-hero-list{justify-content:space-between;flex-wrap:wrap}
.sg-rem .rem-hero-title{display:flex;align-items:center;gap:18px;flex:1;min-width:260px}
.sg-rem .rem-bell{font-size:64px;line-height:1;filter:drop-shadow(0 6px 10px rgba(0,0,0,.12))}
.sg-rem .rem-hero h1{font-size:clamp(26px,3.4vw,38px);font-weight:700}
.sg-rem .rem-hero-title p{margin:6px 0 0;color:var(--hub-ink2);font-size:15px;max-width:420px}
.sg-rem .rem-benefits{background:var(--hub-teal-soft);border-radius:var(--hub-r);padding:22px 26px;max-width:520px;flex:1;min-width:280px}
.sg-rem .rem-benefits b{display:block;font-size:16px;margin-bottom:8px}
.sg-rem .rem-benefits ol{margin:0 0 16px 18px;padding:0;color:var(--hub-ink)}
.sg-rem .rem-benefits li{margin:3px 0}
.sg-rem .rem-benefits .rem-btn{width:100%}
.sg-rem .rem-hero-occasion{background:linear-gradient(120deg,var(--hub-pink),#fff 75%)}
.sg-rem .rem-hero-icon{flex:0 0 96px;height:96px;border-radius:20px;background:#fff;display:grid;place-items:center;font-size:48px;box-shadow:var(--hub-shadow)}
.sg-rem .rem-hero-date{color:var(--hub-ink2);font-size:14px;margin-bottom:4px;text-transform:capitalize}
.sg-rem .rem-hero-in{margin:6px 0 0;font-size:18px;font-weight:700;color:var(--hub-teal-deep)}
.sg-rem .rem-hero-actions{margin-left:auto}

/* sectiuni + carduri */
.sg-rem .rem-section{font-size:22px;font-weight:700;margin:26px 0 10px}
.sg-rem .rem-section em{font-style:normal;color:var(--hub-red)}
.sg-rem .rem-note{color:var(--hub-ink2);margin:0 0 14px}
.sg-rem .rem-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:10px}
.sg-rem .rem-card{position:relative;display:flex;gap:14px;background:#fff;border:1px solid var(--hub-line);border-radius:var(--hub-r);padding:18px 18px 18px 16px;transition:box-shadow .2s,transform .2s}
.sg-rem .rem-card:hover{box-shadow:var(--hub-shadow);transform:translateY(-1px)}
.sg-rem .rem-card-icon{flex:0 0 52px;height:52px;border-radius:14px;background:var(--hub-teal-soft);display:grid;place-items:center;font-size:28px}
.sg-rem .rem-card-body{flex:1;min-width:0}
.sg-rem .rem-card-date{font-size:13px;color:var(--hub-ink2);text-transform:capitalize}
.sg-rem .rem-card-title{font-family:'AvenirNext LT Pro','Open Sans',sans-serif;font-weight:700;font-size:18px;margin:2px 0;word-wrap:break-word}
.sg-rem .rem-card-in{font-size:14px;color:var(--hub-ink2)}
.sg-rem .rem-card-actions{display:flex;flex-direction:column;align-items:flex-end;justify-content:space-between;gap:10px}
.sg-rem .rem-more{background:none;border:0;color:var(--hub-ink2);font-size:18px;width:34px;height:34px;border-radius:50%;cursor:pointer}
.sg-rem .rem-more:hover{background:#f3f7f7;color:var(--hub-ink)}
.sg-rem .rem-menu{display:none;position:absolute;right:14px;top:52px;background:#fff;border:1px solid var(--hub-line);border-radius:10px;box-shadow:var(--hub-shadow);z-index:5;min-width:150px;padding:6px}
.sg-rem .rem-menu.open{display:block}
.sg-rem .rem-menu button{display:flex;align-items:center;gap:8px;width:100%;background:none;border:0;padding:9px 12px;border-radius:8px;font-size:14px;color:var(--hub-ink);cursor:pointer;text-align:left}
.sg-rem .rem-menu button:hover{background:#f3f7f7}
.sg-rem .rem-menu .rem-del{color:var(--hub-red)}
.sg-rem .rem-empty{max-width:480px;margin:40px auto 60px;text-align:center;background:#fff;border:1px solid var(--hub-line);border-radius:var(--hub-r);padding:36px 24px}
.sg-rem .rem-empty-icon{font-size:54px;margin-bottom:10px}
.sg-rem .rem-empty p{color:var(--hub-ink2);margin:0 0 18px}
.sg-rem .rem-login-hint{margin-top:14px;font-size:14px}
.sg-rem .rem-alert{background:#eaf5df;color:#4d8a1e;border-radius:10px;padding:12px 16px;margin-bottom:18px;font-weight:600}

/* pagina ocaziei */
.sg-rem .rem-relation-card{align-items:center;gap:24px;flex-wrap:wrap;margin-bottom:22px}
.sg-rem .rem-relation-field{flex:1;min-width:240px}
.sg-rem .rem-relation-field label{display:block;font-weight:700;margin-bottom:6px}
.sg-rem .rem-relation-hint{flex:1;min-width:240px;background:#fff8e1;border-radius:10px;padding:12px 14px;color:var(--hub-ink);font-size:14px}
.sg-rem .rem-relation-hint i{color:#f5a623;margin-right:6px}
.sg-rem .rem-picks{background:#fff;border:1px solid var(--hub-line);border-radius:var(--hub-r);padding:24px;margin-bottom:22px}
.sg-rem .rem-picks h2{font-size:22px;font-weight:700;text-align:center}
.sg-rem .rem-picks-sub{text-align:center;color:var(--hub-ink2);margin:4px 0 0}
.sg-rem .rem-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-top:20px}
.sg-rem .rem-prod{display:block;color:var(--hub-ink);text-decoration:none}
.sg-rem .rem-prod-img{display:block;aspect-ratio:1/1;border-radius:12px;overflow:hidden;background:#f3f7f7;border:1px solid var(--hub-line)}
.sg-rem .rem-prod-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.sg-rem .rem-prod:hover .rem-prod-img img{transform:scale(1.04)}
.sg-rem .rem-prod-name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:14px;font-weight:600;margin:8px 0 2px;line-height:1.3}
.sg-rem .rem-prod-price{display:block;font-size:14px;color:var(--hub-teal-deep);font-weight:700}
.sg-rem .rem-prod-price s{color:var(--hub-ink2);font-weight:400;margin-right:4px}
.sg-rem .rem-back{margin:10px 0 30px;font-size:15px}

/* campuri */
.sg-rem .rem-field{margin-bottom:14px}
.sg-rem .rem-field label{display:block;font-size:13px;font-weight:700;color:var(--hub-ink2);margin-bottom:5px}
.sg-rem .rem-input{width:100%;height:46px;border:1px solid #d5dee1;border-radius:10px;padding:0 14px;font-size:15px;color:var(--hub-ink);background:#fff;box-shadow:none;transition:border-color .15s,box-shadow .15s;-webkit-appearance:none;appearance:none}
.sg-rem select.rem-input{background:#fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231d2b33' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 14px center;padding-right:36px}
.sg-rem .rem-input:focus{border-color:var(--hub-teal-deep);box-shadow:0 0 0 3px var(--hub-teal-soft);outline:0}
.sg-rem .rem-row2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
.sg-rem .rem-row2 .rem-full{grid-column:1/-1}
.sg-rem .rem-hint{font-size:12px;color:var(--hub-ink2);margin:-6px 0 12px}

/* modal */
.sg-rem .rem-modal{position:fixed;inset:0;z-index:10050;background:rgba(29,43,51,.55);display:flex;align-items:flex-start;justify-content:center;padding:40px 12px;overflow-y:auto}
.sg-rem .rem-modal[hidden]{display:none}
body.rem-modal-open{overflow:hidden}
.sg-rem .rem-modal-box{position:relative;background:#fff;border-radius:18px;width:100%;max-width:480px;padding:30px 28px 24px;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.sg-rem .rem-close{position:absolute;right:12px;top:10px;width:38px;height:38px;border:0;background:none;font-size:28px;line-height:1;color:var(--hub-ink2);cursor:pointer;border-radius:50%}
.sg-rem .rem-close:hover{background:#f3f7f7;color:var(--hub-ink)}
.sg-rem .rem-modal-title{font-size:22px;font-weight:700;margin-bottom:16px;padding-right:30px}
.sg-rem .rem-quick{margin-bottom:16px}
.sg-rem .rem-quick-label{font-size:13px;font-weight:700;color:var(--hub-ink2);margin-bottom:8px}
.sg-rem .rem-chips{display:flex;flex-wrap:wrap;gap:8px}
.sg-rem .rem-chip{background:#fff;border:2px solid var(--hub-ink);border-radius:999px;padding:7px 14px;font-weight:700;font-size:14px;color:var(--hub-ink);cursor:pointer;transition:all .15s}
.sg-rem .rem-chip:hover{border-color:var(--hub-teal-deep);color:var(--hub-teal-deep)}
.sg-rem .rem-chip.on{background:var(--hub-teal-deep);border-color:var(--hub-teal-deep);color:#fff}
.sg-rem .rem-xmas{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--hub-teal-soft);border-radius:10px;padding:12px 14px;margin:4px 0 16px;font-weight:600;cursor:pointer}
.sg-rem .rem-xmas input{width:22px;height:22px;margin:0;accent-color:var(--hub-teal-deep)}
.sg-rem .rem-err{background:#fbe9e8;color:#b8322d;border-radius:10px;padding:10px 14px;margin-bottom:12px;font-size:14px}
.sg-rem .rem-consent{font-size:12px;color:var(--hub-ink2);margin:14px 0 0;line-height:1.45}
.sg-rem .rem-done{text-align:center}
.sg-rem .rem-done-icon{font-size:64px;margin:6px 0 10px}
.sg-rem .rem-done h3{font-size:24px;font-weight:700;margin-bottom:8px}
.sg-rem .rem-done p{color:var(--hub-ink2);margin:0 0 20px}
.sg-rem .rem-done .rem-btn{margin-bottom:10px}
.sg-rem .rem-done-all{display:inline-block;margin-top:6px;font-weight:600}

@media (max-width:991px){
  .sg-rem .rem-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sg-rem .rem-hero-inner{padding:24px 15px;gap:18px}
}
@media (max-width:767px){
  .sg-rem .rem-list{grid-template-columns:minmax(0,1fr)}
  .sg-rem .rem-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .sg-rem .rem-hero-inner{flex-direction:column;align-items:stretch}
  .sg-rem .rem-hero-occasion .rem-hero-inner{flex-direction:row;flex-wrap:wrap}
  .sg-rem .rem-hero-icon{flex-basis:64px;height:64px;font-size:34px;border-radius:14px}
  .sg-rem .rem-hero-actions{margin-left:0;width:100%}
  .sg-rem .rem-bell{font-size:48px}
  .sg-rem .rem-benefits{max-width:none;padding:18px}
  .sg-rem .rem-picks{padding:16px}
  .sg-rem .rem-modal{padding:12px 8px}
  .sg-rem .rem-modal-box{padding:24px 18px 20px}
  .sg-rem .rem-card{padding:14px}
  .sg-rem .rem-card-icon{flex-basis:44px;height:44px;font-size:24px}
  .sg-rem .rem-card-title{font-size:16px}
}
