/* Stage 141 - Final Blue Button Cleanup + Website Consistency Fix */
:root{
  --ys-primary:#0D6EFD;
  --ys-primary-hover:#0B5ED7;
  --ys-primary-active:#0A58CA;
  --ys-primary-soft:#EAF4FF;
  --ys-primary-border:#BBD7FF;
  --ys-navy:#0B1F3A;
  --ys-cyan:#00B8D9;
  --ys-success:#22C55E;
  --ys-warning:#F97316;
  --ys-danger:#DC2626;
  --ys-muted:#64748B;
  --ys-line:#E2E8F0;
  --ys-card:#FFFFFF;
  --ys-bg:#F8FAFC;
  --ys-radius:14px;
  --ys-radius-lg:22px;
  --ys-btn-px:16px;
  --ys-btn-py:10px;
  --ys-shadow:0 14px 34px rgba(15,23,42,.08);
}

/* Tombol utama biru yang seragam */
a.btn:not(.btn-secondary):not(.btn-danger):not(.btn-warning):not(.btn-success):not(.outline-btn):not(.secondary),
button.btn:not(.btn-secondary):not(.btn-danger):not(.btn-warning):not(.btn-success):not(.outline-btn):not(.secondary),
input[type="submit"].btn:not(.btn-secondary):not(.btn-danger):not(.btn-warning):not(.btn-success):not(.outline-btn):not(.secondary),
.btn-primary,
.btn.blue,
.btn.login-btn,
.btn.register-btn,
.ys-primary-btn,
.ys-cta-primary,
button[type="submit"]:not(.btn-danger):not(.btn-warning):not(.btn-success):not(.btn-secondary),
input[type="submit"]:not(.btn-danger):not(.btn-warning):not(.btn-success):not(.btn-secondary){
  background:var(--ys-primary)!important;
  color:#fff!important;
  border:1px solid var(--ys-primary)!important;
  border-radius:var(--ys-radius)!important;
  padding:var(--ys-btn-py) var(--ys-btn-px)!important;
  font-weight:850!important;
  line-height:1.2!important;
  min-height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  box-shadow:0 10px 28px rgba(13,110,253,.22)!important;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease,opacity .16s ease!important;
  text-decoration:none!important;
}

a.btn:not(.btn-secondary):not(.btn-danger):not(.btn-warning):not(.btn-success):not(.outline-btn):not(.secondary):hover,
button.btn:not(.btn-secondary):not(.btn-danger):not(.btn-warning):not(.btn-success):not(.outline-btn):not(.secondary):hover,
.btn-primary:hover,
.btn.blue:hover,
.btn.login-btn:hover,
.btn.register-btn:hover,
.ys-primary-btn:hover,
.ys-cta-primary:hover,
button[type="submit"]:not(.btn-danger):not(.btn-warning):not(.btn-success):not(.btn-secondary):hover{
  background:var(--ys-primary-hover)!important;
  border-color:var(--ys-primary-hover)!important;
  box-shadow:0 14px 34px rgba(13,110,253,.28)!important;
  transform:translateY(-1px);
}

a.btn:not(.btn-secondary):not(.btn-danger):not(.btn-warning):not(.btn-success):not(.outline-btn):not(.secondary):active,
button.btn:not(.btn-secondary):not(.btn-danger):not(.btn-warning):not(.btn-success):not(.outline-btn):not(.secondary):active,
.btn-primary:active,
.btn.blue:active,
.btn.login-btn:active,
.btn.register-btn:active,
.ys-primary-btn:active,
.ys-cta-primary:active,
button[type="submit"]:not(.btn-danger):not(.btn-warning):not(.btn-success):not(.btn-secondary):active{
  background:var(--ys-primary-active)!important;
  border-color:var(--ys-primary-active)!important;
  transform:translateY(0)!important;
}

/* Tombol sekunder tetap putih/border biru */
.btn-secondary,
.btn.secondary,
.outline-btn,
.ys-secondary-btn{
  background:#fff!important;
  color:var(--ys-primary)!important;
  border:1px solid var(--ys-primary-border)!important;
  border-radius:var(--ys-radius)!important;
  padding:var(--ys-btn-py) var(--ys-btn-px)!important;
  font-weight:850!important;
  box-shadow:none!important;
  min-height:42px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
}
.btn-secondary:hover,.btn.secondary:hover,.outline-btn:hover,.ys-secondary-btn:hover{background:var(--ys-primary-soft)!important;color:var(--ys-primary-hover)!important;border-color:var(--ys-primary)!important}

/* Warna khusus tetap sesuai fungsi */
.btn-danger,.ys-danger-btn{background:var(--ys-danger)!important;color:#fff!important;border-color:var(--ys-danger)!important}
.btn-warning,.ys-warning-btn{background:var(--ys-warning)!important;color:#fff!important;border-color:var(--ys-warning)!important}
.btn-success,.ys-success-btn{background:var(--ys-success)!important;color:#fff!important;border-color:var(--ys-success)!important}

/* Disabled state untuk e-wallet kosong/form belum lengkap */
button:disabled,input[type="submit"]:disabled,
.btn[disabled],.btn.disabled,.btn.is-disabled,
[aria-disabled="true"],.ys-disabled,.ys-wallet-disabled{
  background:#CBD5E1!important;
  color:#64748B!important;
  border-color:#CBD5E1!important;
  box-shadow:none!important;
  cursor:not-allowed!important;
  pointer-events:none!important;
  transform:none!important;
  opacity:.88!important;
}
.ys-wallet-warning,.ys-disabled-note{
  display:block;
  margin-top:8px;
  padding:10px 12px;
  border-radius:14px;
  background:#F1F5F9;
  color:#475569;
  font-weight:750;
  font-size:13px;
  line-height:1.45;
}

/* Loading state mencegah double submit */
button.ys-loading,input[type="submit"].ys-loading,.btn.ys-loading{
  position:relative!important;
  pointer-events:none!important;
  opacity:.82!important;
  cursor:wait!important;
}
button.ys-loading::after,input[type="submit"].ys-loading::after,.btn.ys-loading::after{
  content:"";
  width:14px;
  height:14px;
  border-radius:999px;
  border:2px solid rgba(255,255,255,.55);
  border-top-color:#fff;
  display:inline-block;
  animation:ys141spin .75s linear infinite;
}
@keyframes ys141spin{to{transform:rotate(360deg)}}

/* Grid kategori layanan wajib: desktop 4x1, HP 2x2 */
.ys139-category-grid,
.ys-service-category-grid,
[data-ys139-category-grid]{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
  align-items:stretch!important;
}
.ys139-category-card,
.ys-service-category-card{
  min-height:148px!important;
  border-radius:24px!important;
  touch-action:manipulation;
}
.ys139-category-card:focus-visible,
.ys-service-category-card:focus-visible{
  outline:3px solid rgba(13,110,253,.30)!important;
  outline-offset:3px!important;
}
@media(max-width:767.98px){
  .ys139-category-grid,
  .ys-service-category-grid,
  [data-ys139-category-grid]{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
  }
  .ys139-category-card,
  .ys-service-category-card{
    min-height:140px!important;
    padding:14px!important;
    border-radius:20px!important;
  }
}

/* Card umum, riwayat order, invoice, dan box ringkasan */
.card,.ys-card,.order-card,.invoice-card,.ys-invoice-card,.ys-summary-card,.ys141-card,
[class*="card140"],[class*="stage"] .card{
  border-radius:var(--ys-radius-lg)!important;
  border:1px solid var(--ys-line)!important;
  box-shadow:var(--ys-shadow)!important;
}
.ys-invoice-section,.invoice-section,.ys-fee-breakdown,.ys141-invoice-breakdown{
  background:#fff;
  border:1px solid var(--ys-line);
  border-radius:18px;
  padding:14px;
  margin:12px 0;
}
.ys-invoice-row,.invoice-row,.ys-fee-row,.ys141-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  padding:10px 0;
  border-bottom:1px dashed #E2E8F0;
}
.ys-invoice-row:last-child,.invoice-row:last-child,.ys-fee-row:last-child,.ys141-row:last-child{border-bottom:0}
.ys-invoice-row.total,.invoice-row.total,.ys-fee-row.total,.ys141-row.total{
  border-top:2px solid var(--ys-line);
  margin-top:6px;
  padding-top:14px;
  font-weight:950;
  color:var(--ys-navy);
}
.ys-invoice-label,.ys-fee-label{color:#475569;font-weight:750}
.ys-invoice-value,.ys-fee-value{font-weight:900;color:#0F172A;text-align:right}
.ys-invoice-title,.ys-section-title{font-size:18px;font-weight:950;color:var(--ys-navy);letter-spacing:-.02em;margin:0 0 10px}

/* Tipografi dan jarak agar tidak padat */
h1,h2,h3{letter-spacing:-.025em}
h1{line-height:1.08} h2{line-height:1.14} h3{line-height:1.2}
.ys-page-section,.section,.ys-section{margin-bottom:24px}
.ys-page-section > * + *, .ys-section > * + *{margin-top:12px}
.table th,.table td,table th,table td{vertical-align:top}

@media(max-width:767.98px){
  :root{--ys-btn-px:14px;--ys-btn-py:10px;--ys-radius:13px;--ys-radius-lg:18px}
  a.btn,button.btn,.btn-primary,button[type="submit"],input[type="submit"]{width:auto;min-height:44px!important}
  .actions,.hero-actions,.topbar-actions{gap:8px!important}
  .ys-invoice-row,.invoice-row,.ys-fee-row,.ys141-row{font-size:14px;gap:10px}
  .ys-invoice-title,.ys-section-title{font-size:16px}
}