/* =========================================================
   KK Deals UI – Exact Cardhub Skin
   Nur Style geändert
   Inhalt + Funktion bleiben gleich
========================================================= */

.kk-deals{
  --brand-yellow:#E9BA1E;
  --kk-green:#b0d6b2;
  --kk-red:#DF410A;
  --kk-violet:#8e79ff;
  --kk-blue:#7ea4e6;
  --kk-white:#F7F7F2;
  --kk-soft:rgba(247,247,242,.72);
  --kk-line:rgba(255,255,255,.10);
  --kk-line-2:rgba(255,255,255,.14);

  --kk-card:#f5f1ea;
  --kk-card-2:#ece7de;
  --kk-ink:#1f2229;
  --kk-muted:#6d7078;

  --bg:#0A0A0D;
  --panel:#111216;
  --panel-2:#17181D;

  --text:var(--kk-white);
  --muted:var(--kk-soft);

  --border:rgba(255,255,255,.06);
  --stroke:rgba(255,255,255,.44);

  --yellow:var(--brand-yellow);
  --green1:var(--kk-green);
  --green2:#74ba8c;

  --cta:var(--kk-red);
  --cta2:#ef7446;

  --shadow:
    0 24px 50px rgba(0,0,0,.34),
    0 8px 18px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.03);

  color:var(--text);
  font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}

.kk-deals.is-loading{
  opacity:.65;
  pointer-events:none;
}

/* =========================================================
   FILTERBAR
========================================================= */

.kk-deals__filters{
  position:sticky;
  top:20px;
  z-index:6;
  margin-bottom:16px;
  padding:14px;
  border:1px solid var(--border);
  border-radius:24px;
  background:
    radial-gradient(720px 300px at 0% 100%, rgba(233,186,30,.08), transparent 62%),
    radial-gradient(480px 240px at 100% 0%, rgba(223,65,10,.08), transparent 58%),
    radial-gradient(440px 220px at 50% 0%, rgba(176,214,178,.05), transparent 62%),
    linear-gradient(180deg, #111216 0%, #0A0A0D 100%);
  box-shadow:var(--shadow);
  overflow:hidden;
}

.kk-deals__filters::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(233,186,30,.36), transparent);
  pointer-events:none;
}

.kk-deals__filter-row{
  position:relative;
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:10px;
  align-items:center;
}

/* =========================================================
   INPUTS
========================================================= */

.kk-deals__search,
.kk-deals__select{
  width:100%;
  min-height:54px;
  padding:12px 14px;
  border-radius:18px;
  outline:none;
  transition:
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease,
    transform .18s ease;
}

.kk-deals__search{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);
  color:#fff;
  font-size:15px;
}

.kk-deals__search::placeholder{
  color:rgba(247,247,242,.42);
}

.kk-deals__search:focus{
  border-color:rgba(233,186,30,.35);
  box-shadow:0 0 0 3px rgba(233,186,30,.10);
}

.kk-deals .kk-deals__select{
  appearance:none;
  -webkit-appearance:none;
  color-scheme:light !important;
  forced-color-adjust:none !important;
  background:#ffffff !important;
  background-color:#ffffff !important;
  color:#000000 !important;
  -webkit-text-fill-color:#000000 !important;
  border:1px solid rgba(0,0,0,.20) !important;
  padding-right:38px;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(0,0,0,.70) 50%),
    linear-gradient(135deg, rgba(0,0,0,.70) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(50% - 2px),
    calc(100% - 12px) calc(50% - 2px);
  background-size:6px 6px, 6px 6px;
  background-repeat:no-repeat;
}

.kk-deals .kk-deals__select:focus{
  border-color:rgba(0,0,0,.35) !important;
  box-shadow:0 0 0 4px rgba(116,186,140,.18);
}

.kk-deals .kk-deals__select option,
.kk-deals .kk-deals__select optgroup{
  background:#ffffff !important;
  color:#000000 !important;
}

/* =========================================================
   TOGGLE
========================================================= */

.kk-deals__toggle{
  display:inline-flex;
  align-items:center;
  gap:10px;
  white-space:nowrap;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:999px;
  background:rgba(255,255,255,.05);
  font-size:13px;
  font-weight:800;
  color:rgba(255,255,255,.86);
}

.kk-deals__toggle input{
  width:18px;
  height:18px;
  accent-color:rgb(116,186,140);
}

/* =========================================================
   BUTTONS GLOBAL
========================================================= */

.kk-deals__button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:46px;
  padding:12px 18px;
  border-radius:999px;
  cursor:pointer;
  font-size:14px;
  font-weight:900;
  color:#111216;
  border:1px solid rgba(233,186,30,.40);
  background:linear-gradient(135deg, var(--brand-yellow), #f3cb5c);
  box-shadow:0 10px 22px rgba(233,186,30,.24);
  transition:transform .2s ease, filter .2s ease;
}

.kk-deals__button:hover{
  transform:translateY(-2px);
  filter:brightness(1.02);
}

.kk-deals__button--ghost{
  color:#fff;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.04);
  box-shadow:none;
}

.kk-deals__filters .kk-deals__button:not(.kk-deals__button--ghost){
  color:#111216;
  border:1px solid rgba(176,214,178,.55);
  background:linear-gradient(180deg, var(--green1), var(--green2));
  box-shadow:0 16px 38px rgba(116,186,140,.18);
}

/* =========================================================
   GRID
========================================================= */

.kk-deals__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
  align-items:stretch;
}

.kk-deals__grid > *{
  height:100%;
}

/* =========================================================
   DEAL CARD
========================================================= */

.kk-deal-card{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-rows:auto 1fr;
  height:100%;
  border-radius:24px;
  background:linear-gradient(180deg, var(--kk-card) 0%, var(--kk-card-2) 100%);
  border:1px solid rgba(255,255,255,.44);
  box-shadow:
    0 18px 34px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.42);
  transition:transform .22s ease, box-shadow .22s ease;
}

.kk-deal-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:24px;
  pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
}

.kk-deal-card::after{
  content:"";
  position:absolute;
  inset:-2px;
  background:radial-gradient(460px 160px at 18% 0%, rgba(255,255,255,.10), transparent 60%);
  pointer-events:none;
}

@media (hover:hover){
  .kk-deal-card:hover{
    transform:translateY(-6px);
    box-shadow:
      0 26px 46px rgba(0,0,0,.28),
      inset 0 1px 0 rgba(255,255,255,.42);
  }

  .kk-deal-card:hover .kk-deal-card__thumb img{
    transform:scale(1.08);
    filter:saturate(1.06) contrast(1.02);
  }
}

/* =========================================================
   THUMB
========================================================= */

.kk-deal-card__thumb{
  position:relative;
  display:block;
  overflow:hidden;
  min-height:230px;
  background:#1b1d24;
}

.kk-deal-card__thumb::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.16) 38%, rgba(0,0,0,.62) 100%);
  pointer-events:none;
}

.kk-deal-card__thumb img{
  display:block;
  width:100%;
  height:230px;
  object-fit:cover;
  transition:transform .55s ease, filter .45s ease;
}

.kk-deals__thumb--placeholder{
  height:230px;
  background:#1b1d24;
}

/* =========================================================
   BODY
========================================================= */

.kk-deal-card__body{
  display:flex;
  flex-direction:column;
  gap:12px;
  height:100%;
  padding:16px;
}

.kk-deal-card__title,
.kk-deal-card__value,
.kk-deal-card__meta,
.kk-deal-card__excerpt,
.kk-deal-card__body p{
  margin:0;
}

.kk-deal-card__title{
  font-size:26px;
  line-height:1.02;
  letter-spacing:-.03em;
  font-weight:950;
}

.kk-deal-card__title a{
  color:var(--kk-ink);
  text-decoration:none;
}

.kk-deal-card__badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-content:flex-start;
  min-height:76px;
}

.kk-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  padding:7px 11px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--kk-ink);
  border:1px solid rgba(31,34,41,.10);
  background:rgba(255,255,255,.52);
}

.kk-badge--ok{
  color:#23412f;
  border-color:rgba(176,214,178,.30);
  background:rgba(176,214,178,.24);
}

.kk-badge--warn{
  color:#6a4200;
  border-color:rgba(233,186,30,.30);
  background:rgba(233,186,30,.20);
}

.kk-deal-card__value{
  padding:10px 12px;
  border-radius:16px;
  background:rgba(255,255,255,.44);
  border:1px solid rgba(31,34,41,.10);
  color:var(--kk-ink);
  font-size:15px;
  font-weight:950;
}

.kk-deal-card__meta{
  color:var(--kk-muted);
  font-size:13px;
  line-height:1.55;
}

.kk-deal-card__excerpt{
  color:#4f5564;
  font-size:14px;
  line-height:1.72;
}

.kk-deal-card__spacer{
  flex:1 1 auto;
}

/* =========================================================
   ACTIONS
========================================================= */

.kk-deal-card__actions{
  display:flex;
  gap:8px;
  margin-top:auto;
  padding-top:6px;
}

.kk-deal-card__btn{
  flex:1 1 0;
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  border-radius:999px;
  text-decoration:none;
  font-size:14px;
  font-weight:900;
  text-align:center;
  color:#111216;
  border:1px solid rgba(233,186,30,.40);
  background:linear-gradient(135deg, var(--brand-yellow), #f3cb5c);
  box-shadow:0 10px 22px rgba(233,186,30,.24);
  transition:transform .2s ease, filter .2s ease;
}

.kk-deal-card__btn:hover{
  transform:translateY(-2px);
  filter:brightness(1.02);
}

.kk-deal-card__btn--ghost{
  color:var(--kk-ink);
  border:1px solid rgba(31,34,41,.10);
  background:rgba(255,255,255,.52);
  box-shadow:none;
}

.kk-deal-card__btn--green{
  color:#111216;
  border:1px solid rgba(176,214,178,.40);
  background:linear-gradient(180deg, var(--green1), var(--green2));
  box-shadow:0 16px 38px rgba(116,186,140,.18);
}

/* =========================================================
   EMPTY / PAGER
========================================================= */

.kk-deals__empty{
  padding:18px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:18px;
  background:rgba(255,255,255,.05);
  text-align:center;
  color:var(--muted);
}

.kk-deals__pager{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  margin:20px 0;
}

.kk-deals__page{
  padding:10px 14px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:16px;
  background:rgba(255,255,255,.04);
  color:var(--text);
  font-weight:900;
  cursor:pointer;
  transition:transform .18s ease, border-color .18s ease, background .18s ease;
}

.kk-deals__page:hover{
  transform:translateY(-1px);
  border-color:rgba(233,186,30,.20);
}

.kk-deals__page.is-active{
  color:#111216;
  border-color:rgba(176,214,178,.55);
  background:linear-gradient(180deg, var(--green1), var(--green2));
  box-shadow:0 16px 38px rgba(116,186,140,.18);
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width:1024px){
  .kk-deals__grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .kk-deals__filter-row{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
}

@media (max-width:640px){
  .kk-deals__grid{
    grid-template-columns:1fr;
    gap:12px;
  }

  .kk-deals__filter-row{
    grid-template-columns:1fr;
  }

  .kk-deals__filters{
    top:10px;
    border-radius:22px;
  }

  .kk-deal-card{
    border-radius:18px;
  }

  .kk-deal-card__thumb,
  .kk-deal-card__thumb img,
  .kk-deals__thumb--placeholder{
    min-height:250px;
    height:250px;
  }

  .kk-deal-card__body{
    padding:14px;
    gap:10px;
  }

  .kk-deal-card__title{
    font-size:23px;
  }

  .kk-deal-card__actions{
    flex-direction:column;
  }

  .kk-deal-card__btn{
    width:100%;
  }
}