
    :root{
      --primary:#6c3df2;
      --primary-soft:#f3edff;
      --bg:#f3f4f6;
      --text:#111827;
      --muted:#6b7280;
      --border:#e5e7eb;
      --radius:14px;
    }
    *{box-sizing:border-box;margin:0;padding:0;}
    .service-wizard-wrap{
      max-width:1200px;
      margin:20px auto 32px;
      padding:0 20px;
    }
    .service-wizard-card{
      background:#fff;
      border-radius:var(--radius);
      border:1px solid var(--border);
      box-shadow:0 12px 26px rgba(15,23,42,.08);
      padding:16px;
    }
    .service-wizard-header{
      display:flex;
      flex-direction:column;
      gap:4px;
      margin-bottom:12px;
    }
    .service-wizard-kicker{
      font-size:12px;
      text-transform:uppercase;
      letter-spacing:.12em;
      color:var(--muted);
    }
    .service-wizard-title{
      font-size:19px;
      font-weight:700;
      color:#0f172a;
    }
    .service-wizard-sub{
      font-size:13px;
      color:var(--muted);
    }
    .service-step-pills{
      display:flex;
      gap:8px;
      font-size:12px;
      color:#6b7280;
      margin-bottom:12px;
      flex-wrap:wrap;
    }
    .service-step-pill{
      padding:4px 10px;
      border-radius:999px;
      border:1px solid #e5e7eb;
      background:#f9fafb;
      display:flex;
      align-items:center;
      gap:6px;
    }
    .service-step-pill-num{
      width:18px;
      height:18px;
      border-radius:999px;
      border:1px solid #e5e7eb;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:12px;
      font-weight:600;
      background:#fff;
      color:#6b7280;
    }
    .service-step-pill.active{
      border-color:#6c3df2;
      background:#f3edff;
      color:#4c1d95;
    }
    .service-step-pill.active .service-step-pill-num{
      background:#6c3df2;
      color:#fff;
      border-color:#6c3df2;
    }
    .service-step-body{
      margin-top:4px;
      border-radius:12px;
      border:1px dashed #e5e7eb;
      background:linear-gradient(135deg,#fafafa,#f5f3ff);
      padding:12px 12px 10px;
      font-size:14px;
      color:#111827;
      margin-bottom:12px;
    }
    .service-step{
      display:none;
    }
    .service-step.active{
      display:block;
    }
    .service-step h3{
      font-size:16px;
      font-weight:600;
      margin:0 0 4px;
    }
    .service-step small{
      display:block;
      font-size:12px;
      color:#6b7280;
      margin-bottom:8px;
    }
    .service-field-row{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
      gap:10px;
      margin-top:8px;
      margin-bottom:4px;
      font-size:13px;
    }
    .service-field{
      display:flex;
      flex-direction:column;
      gap:3px;
    }
    .service-field label{
      font-size:13px;
      color:#6b7280;
    }
    .service-field input,
    .service-field select,
    .service-field textarea{
      width:100%;
      padding:7px 9px;
      border-radius:9px;
      border:1px solid #d1d5db;
      font-size:14px;
      background:#f9fafb;
      outline:none;
    }
    .service-field textarea{
      min-height:70px;
      resize:vertical;
    }
    .service-field input:focus,
    .service-field select:focus,
    .service-field textarea:focus{
      border-color:#6c3df2;
      background:#fff;
      box-shadow:0 0 0 1px rgba(108,61,242,.12);
    }
    .service-plan-options,
    .service-channel-options,
    .service-package-options{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
      gap:8px;
      margin-top:8px;
      font-size:13px;
    }
    .service-chip{
      border-radius:12px;
      border:1px solid #e5e7eb;
      padding:9px;
      font-size:13px;
      cursor:pointer;
      background:#f9fafb;
      display:flex;
      flex-direction:column;
      gap:3px;
    }
    .service-chip-badge{
      font-size:11px;
      display:inline-flex;
      align-items:center;
      padding:2px 7px;
      border-radius:999px;
      background:#eef2ff;
      color:#4f46e5;
      border:1px solid #e0e7ff;
      margin-bottom:2px;
    }
    .service-chip.selected{
      border-color:#6c3df2;
      background:#f3edff;
      box-shadow:0 0 0 1px rgba(108,61,242,.25);
    }
    .service-summary{
      font-size:13px;
      line-height:1.5;
    }
    .service-summary dt{
      font-weight:600;
      margin-top:4px;
    }
    .service-summary dd{
      margin:0;
      color:#4b5563;
    }
    .service-wizard-footer{
      display:flex;
      justify-content:space-between;
      align-items:center;
      margin-top:10px;
      flex-wrap:wrap;
      gap:8px;
      font-size:13px;
    }
    .service-wizard-footer-left{
      font-size:12px;
      color:#6b7280;
    }
    .service-wizard-footer-right{
      display:flex;
      gap:8px;
      align-items:center;
    }

    /* Tasarım siparişi sayfasındaki buton stili ile aynı */
    .btn{
      border-radius:999px;
      border:1px solid #d1d5db;
      padding:7px 12px;
      font-size:13px;
      background:#fff;
      color:#111827;
      cursor:pointer;
      display:inline-flex;
      align-items:center;
      gap:6px;
    }
    .btn-primary{
      border:none;
      background:linear-gradient(135deg,#6c3df2,#a855f7);
      color:#fff;
      box-shadow:0 12px 24px rgba(108,61,242,.45);
    }
    .btn-primary:hover{
      filter:brightness(1.05);
      transform:translateY(-1px);
    }

    @media (max-width:640px){
      .service-wizard-card{
        padding:14px 12px 12px;
      }
      .service-wizard-footer{
        flex-direction:column;
        align-items:flex-end;
      }
    }
  