/* =========================================
   AuftragsPilot Final Light Feinschliff
   Nur Optik - keine Logik
   ========================================= */

/* Seite insgesamt ruhiger */
body.ap-exact-dashboard-active,
body.ap-exact-dashboard-active .app,
body.ap-exact-dashboard-active .main {
  background:
    radial-gradient(circle at 8% 8%, rgba(255,255,255,.46), transparent 30%),
    radial-gradient(circle at 92% 4%, rgba(142,239,230,.36), transparent 35%),
    linear-gradient(135deg, #8fb2e0 0%, #dce9fb 52%, #c7eeee 100%) !important;
}

/* Desktop: Abstand wie Vorlage */
@media screen and (min-width: 901px) {
  body.ap-exact-dashboard-active .main {
    padding: 16px 22px 34px !important;
  }
}

/* =========================
   HERO OBEN
   ========================= */

.ap-light-hero {
  min-height: 300px !important;
  padding: 40px 38px 24px !important;
  border-radius: 26px !important;
  border: 1px solid rgba(255,255,255,.88) !important;
  background:
    radial-gradient(circle at 88% 12%, rgba(134,239,229,.36), transparent 28%),
    linear-gradient(135deg, rgba(244,243,255,.78), rgba(236,244,255,.72) 48%, rgba(215,248,244,.70)) !important;
  box-shadow:
    0 22px 48px rgba(74,108,160,.16),
    inset 0 1px 0 rgba(255,255,255,.80) !important;
}

.ap-light-wave {
  right: -20px !important;
  top: -8px !important;
  width: 680px !important;
  height: 180px !important;
  opacity: .55 !important;
}

.ap-light-title h1 {
  font-size: clamp(62px, 5.3vw, 82px) !important;
  line-height: .98 !important;
  letter-spacing: -.075em !important;
  color: #172f68 !important;
  font-weight: 950 !important;
  margin-bottom: 12px !important;
}

.ap-light-title p {
  color: #2d426f !important;
  font-size: 20px !important;
  line-height: 1.42 !important;
}

.ap-light-sync {
  padding: 16px 26px !important;
  min-height: 58px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.70) !important;
  border: 1px solid rgba(255,255,255,.92) !important;
  color: #1d355f !important;
  font-size: 16px !important;
  box-shadow:
    0 14px 28px rgba(74,108,160,.15),
    inset 0 1px 0 rgba(255,255,255,.84) !important;
}

/* =========================
   OBERE ICON-LEISTE
   ========================= */

.ap-light-strip {
  margin-top: 32px !important;
  padding: 18px 14px !important;
  border-radius: 25px !important;
  background: rgba(255,255,255,.58) !important;
  border: 1px solid rgba(255,255,255,.88) !important;
  box-shadow:
    0 18px 34px rgba(74,108,160,.12),
    inset 0 1px 0 rgba(255,255,255,.78) !important;
}

.ap-light-quick {
  min-height: 112px !important;
  gap: 9px !important;
  color: #172f68 !important;
  font-size: 15px !important;
  font-weight: 800 !important;
}

.ap-light-quick-icon {
  width: 68px !important;
  height: 68px !important;
  border-radius: 19px !important;
  font-size: 36px !important;
  background: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(255,255,255,.92) !important;
  box-shadow:
    0 12px 24px rgba(74,108,160,.13),
    inset 0 1px 0 rgba(255,255,255,.86) !important;
}

/* Farben obere Icons */
.ap-light-quick.laser .ap-light-quick-icon {
  color: #ff7a1a !important;
  background: linear-gradient(145deg, #fff5ed, #ffe7d8) !important;
}

.ap-light-quick.print3d .ap-light-quick-icon {
  color: #1e87ff !important;
  background: linear-gradient(145deg, #eef7ff, #dcedff) !important;
}

.ap-light-quick.calc .ap-light-quick-icon {
  color: #29b957 !important;
  background: linear-gradient(145deg, #effcf2, #dcf6e2) !important;
}

.ap-light-quick.orders .ap-light-quick-icon {
  color: #8a4fff !important;
  background: linear-gradient(145deg, #f8f0ff, #eadfff) !important;
}

.ap-light-quick.market .ap-light-quick-icon {
  color: #f5a400 !important;
  background: linear-gradient(145deg, #fff8e8, #ffedc4) !important;
}

.ap-light-quick.admin .ap-light-quick-icon {
  color: #53739b !important;
  background: linear-gradient(145deg, #f2f7fd, #e2edf8) !important;
}

/* =========================
   HILFELEISTE
   ========================= */

.ap-light-help {
  margin-top: 13px !important;
  padding: 22px 26px !important;
  border-radius: 22px !important;
  background: rgba(255,255,255,.54) !important;
  border: 1px solid rgba(255,255,255,.86) !important;
  box-shadow:
    0 16px 30px rgba(74,108,160,.10),
    inset 0 1px 0 rgba(255,255,255,.78) !important;
}

.ap-light-info {
  width: 58px !important;
  height: 58px !important;
  border-radius: 18px !important;
}

.ap-light-help-title strong {
  color: #172f68 !important;
  font-size: 21px !important;
  line-height: 1.12 !important;
}

.ap-light-help-title span {
  color: #40527a !important;
}

.ap-light-step-num {
  width: 43px !important;
  height: 43px !important;
  border-radius: 15px !important;
}

.ap-light-step strong {
  color: #172f68 !important;
}

.ap-light-step p {
  color: #40527a !important;
}

/* =========================
   GROSSE KACHELN
   ========================= */

.ap-light-grid {
  margin-top: 14px !important;
  gap: 17px !important;
}

.ap-light-card {
  min-height: 244px !important;
  padding: 28px 28px 72px !important;
  border-radius: 24px !important;
  border: 1px solid rgba(255,255,255,.88) !important;
  box-shadow:
    0 20px 38px rgba(74,108,160,.14),
    inset 0 1px 0 rgba(255,255,255,.80) !important;
}

.ap-light-card:hover {
  transform: translateY(-3px) !important;
  box-shadow:
    0 26px 50px rgba(74,108,160,.21),
    inset 0 1px 0 rgba(255,255,255,.84) !important;
}

.ap-light-card-icon {
  width: 82px !important;
  height: 82px !important;
  border-radius: 20px !important;
  font-size: 42px !important;
  box-shadow:
    0 16px 28px rgba(74,108,160,.15),
    inset 0 1px 0 rgba(255,255,255,.78) !important;
}

.ap-light-card h3 {
  font-size: 29px !important;
  line-height: 1.05 !important;
  margin: 18px 0 10px !important;
  letter-spacing: -.04em !important;
}

.ap-light-card p {
  font-size: 15.5px !important;
  line-height: 1.48 !important;
  color: #32466f !important;
  max-width: 330px !important;
}

.ap-light-card-action {
  left: 28px !important;
  bottom: 24px !important;
  font-size: 15.5px !important;
  font-weight: 900 !important;
}

.ap-light-card-arrow {
  font-size: 26px !important;
}

/* Hintergrund-Grafiken klarer wie Vorlage */
.ap-light-card-ghost {
  right: 18px !important;
  bottom: 16px !important;
  font-size: 126px !important;
  opacity: .13 !important;
}

/* Laser */
.ap-light-card.laser {
  background:
    radial-gradient(circle at 86% 70%, rgba(255,158,73,.26), transparent 34%),
    linear-gradient(135deg, rgba(255,247,240,.88), rgba(255,226,205,.76)) !important;
  border-color: rgba(255,169,96,.64) !important;
}

.ap-light-card.laser .ap-light-card-icon {
  background: linear-gradient(145deg, #ff9f44, #ff6f20) !important;
}

.ap-light-card.laser h3,
.ap-light-card.laser .ap-light-card-action {
  color: #f27717 !important;
}

/* 3D */
.ap-light-card.print3d {
  background:
    radial-gradient(circle at 84% 75%, rgba(69,149,255,.24), transparent 34%),
    linear-gradient(135deg, rgba(239,248,255,.90), rgba(207,229,255,.78)) !important;
  border-color: rgba(93,164,255,.64) !important;
}

.ap-light-card.print3d .ap-light-card-icon {
  background: linear-gradient(145deg, #65b7ff, #1f82ff) !important;
}

.ap-light-card.print3d h3,
.ap-light-card.print3d .ap-light-card-action {
  color: #2f8eff !important;
}

/* Kalkulation */
.ap-light-card.calc {
  background:
    radial-gradient(circle at 86% 78%, rgba(63,191,93,.24), transparent 34%),
    linear-gradient(135deg, rgba(241,255,244,.90), rgba(208,246,218,.78)) !important;
  border-color: rgba(83,201,108,.60) !important;
}

.ap-light-card.calc .ap-light-card-icon {
  background: linear-gradient(145deg, #6be688, #2fbb5b) !important;
}

.ap-light-card.calc h3,
.ap-light-card.calc .ap-light-card-action {
  color: #45b75f !important;
}

/* Aufträge */
.ap-light-card.orders {
  background:
    radial-gradient(circle at 86% 76%, rgba(148,91,255,.22), transparent 34%),
    linear-gradient(135deg, rgba(250,244,255,.90), rgba(232,213,255,.78)) !important;
  border-color: rgba(157,101,255,.60) !important;
}

.ap-light-card.orders .ap-light-card-icon {
  background: linear-gradient(145deg, #bb8dff, #7d4dff) !important;
}

.ap-light-card.orders h3,
.ap-light-card.orders .ap-light-card-action {
  color: #8e63ef !important;
}

/* Verkauf */
.ap-light-card.market {
  background:
    radial-gradient(circle at 86% 76%, rgba(245,164,0,.24), transparent 34%),
    linear-gradient(135deg, rgba(255,249,235,.92), rgba(255,231,183,.82)) !important;
  border-color: rgba(245,170,20,.60) !important;
}

.ap-light-card.market .ap-light-card-icon {
  background: linear-gradient(145deg, #ffc650, #f29d00) !important;
}

.ap-light-card.market h3,
.ap-light-card.market .ap-light-card-action {
  color: #df8a00 !important;
}

/* Verwaltung */
.ap-light-card.admin {
  background:
    radial-gradient(circle at 86% 76%, rgba(96,126,165,.20), transparent 34%),
    linear-gradient(135deg, rgba(243,248,255,.90), rgba(216,230,247,.80)) !important;
  border-color: rgba(100,129,166,.54) !important;
}

.ap-light-card.admin .ap-light-card-icon {
  background: linear-gradient(145deg, #89abd3, #55779f) !important;
}

.ap-light-card.admin h3,
.ap-light-card.admin .ap-light-card-action {
  color: #5878a0 !important;
}

/* =========================
   UNTERSEITEN-WERKZEUGKACHELN
   ========================= */

body.ap-exact-dashboard-active .ap-exact-tool {
  min-height: 122px !important;
  border-radius: 23px !important;
  padding: 25px 26px !important;
  background:
    radial-gradient(circle at 88% 8%, rgba(255,255,255,.58), transparent 32%),
    linear-gradient(135deg, rgba(255,255,255,.76), rgba(232,242,255,.68)) !important;
}

body.ap-exact-dashboard-active .ap-exact-tool strong {
  font-size: 23px !important;
  color: #172f68 !important;
}

body.ap-exact-dashboard-active .ap-exact-tool span {
  font-size: 16px !important;
  color: #40527a !important;
}

/* Mobile */
@media screen and (max-width: 900px) {
  .ap-light-hero {
    min-height: auto !important;
    padding: 26px 20px 20px !important;
  }

  .ap-light-title h1 {
    font-size: 44px !important;
  }

  .ap-light-strip {
    grid-template-columns: repeat(2, 1fr) !important;
    padding: 12px !important;
  }

  .ap-light-card {
    min-height: 215px !important;
    padding: 24px 22px 68px !important;
  }

  .ap-light-card-icon {
    width: 68px !important;
    height: 68px !important;
    font-size: 34px !important;
  }

  .ap-light-card h3 {
    font-size: 25px !important;
  }
}
