/*
 * Project CSS for unlimitedultra8kott.
 * Shared classes for website sections.
 */
:root{--u8k-bg:#fff;--u8k-primary:#0055DA;--u8k-primary-dark:#003f9f;--u8k-primary-soft:#eaf2ff;--u8k-accent:#f8c400;--u8k-accent-soft:#fff7d6;--u8k-text:#0f172a;--u8k-muted:#64748b;--u8k-border:#e2e8f0}html,body{background:var(--u8k-bg);color:var(--u8k-text)}.u8k-page-bg{background:var(--u8k-bg);color:var(--u8k-text)}.u8k-container{width:min(1180px,calc(100% - 32px));margin-left:auto;margin-right:auto}.u8k-text-muted{color:var(--u8k-muted)}.u8k-primary-text{color:var(--u8k-primary)}.u8k-accent-text{color:var(--u8k-accent)}.u8k-btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:12px 20px;border-radius:999px;background:var(--u8k-primary);color:#fff;font-weight:700;text-decoration:none;border:1px solid var(--u8k-primary);transition:transform 180ms ease,box-shadow 180ms ease,background 180ms ease}.u8k-btn-primary:hover{background:var(--u8k-primary-dark);transform:translateY(-1px);box-shadow:0 12px 28px rgba(0,85,218,.22)}.u8k-btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:12px 20px;border-radius:999px;background:#fff;color:var(--u8k-primary);font-weight:700;text-decoration:none;border:1px solid rgba(0,85,218,.18);transition:background 180ms ease,border-color 180ms ease,transform 180ms ease}.u8k-btn-secondary:hover{background:var(--u8k-primary-soft);border-color:rgba(0,85,218,.35);transform:translateY(-1px)}.u8k-card{background:#fff;border:1px solid var(--u8k-border);border-radius:24px;box-shadow:0 18px 45px rgba(15,23,42,.06)}.u8k-soft-panel{background:linear-gradient(135deg,#fff 0%,var(--u8k-primary-soft) 100%);border:1px solid rgba(0,85,218,.12)}.u8k-yellow-badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 12px;background:var(--u8k-accent-soft);color:#7a5a00;font-size:13px;font-weight:700}.u8k-menu-check{-webkit-appearance:none;display:none;visibility:hidden}.u8k-menu-bar{display:block;position:relative;cursor:pointer;width:42px;height:34px}.u8k-menu-bar span{position:absolute;width:38px;height:5px;background:#f1faee;border-radius:100px;display:inline-block;transition:.3s ease;left:0}.u8k-menu-bar span.top{top:0}.u8k-menu-bar span.middle{top:14px}.u8k-menu-bar span.bottom{bottom:0}.u8k-menu-check:checked~span.top{transform:rotate(45deg);transform-origin:top left;width:40px;left:5px}.u8k-menu-check:checked~span.bottom{transform:rotate(-45deg);transform-origin:top left;width:40px;bottom:-1px;box-shadow:0 0 10px rgba(73,80,87,.7)}.u8k-menu-check:checked~span.middle{transform:translateX(-18px);opacity:0}@keyframes u8kFadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}.u8k-fade-in{opacity:0;animation:u8kFadeUp 760ms ease forwards}.u8k-fade-delay-1{animation-delay:120ms}.u8k-fade-delay-2{animation-delay:240ms}.u8k-fade-delay-3{animation-delay:360ms}@media (prefers-reduced-motion:reduce){.u8k-fade-in{opacity:1;animation:none}}

/* Compact invoice payment form - mobile friendly */
#invoiceSection #updatePaymentForm{display:grid;gap:12px;width:100%;max-width:560px;margin:0 auto;padding:14px;border:1px solid rgba(0,85,218,.14);border-radius:18px;background:#fff;box-shadow:0 10px 26px rgba(15,23,42,.06)}
#invoiceSection #updatePaymentForm::before{content:"Secure payment review";display:inline-flex;width:fit-content;border-radius:999px;padding:6px 10px;background:var(--u8k-primary-soft);color:var(--u8k-primary);font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;border:1px solid rgba(0,85,218,.12)}
#invoiceSection #payment,#invoiceSection #uploade{display:grid;gap:8px;padding:12px;border:1px solid var(--u8k-border);border-radius:16px;background:#fff}
#invoiceSection #paymentNote,#invoiceSection #existingProofs{display:grid;gap:8px;padding:10px;border:1px solid var(--u8k-border);border-radius:14px;background:#fff;color:var(--u8k-muted);font-size:12px;font-weight:600;line-height:1.45}
#invoiceSection #paymentNote:empty,#invoiceSection #existingProofs:empty{display:none!important}
#invoiceSection #payment label,#invoiceSection #uploade label,#invoiceSection #updatePaymentForm>label,#invoiceSection #updatePaymentForm strong,#invoiceSection #updatePaymentForm b{color:var(--u8k-text);font-size:12px;font-weight:800;letter-spacing:0;line-height:1.25}
#invoiceSection #paymentSelect,#invoiceSection #paymentProof,#invoiceSection #updatePaymentForm select,#invoiceSection #updatePaymentForm input[type="file"]{width:100%;min-height:42px;border:1px solid var(--u8k-border);border-radius:14px;background:#f8fbff;color:var(--u8k-text);padding:9px 12px;font-size:14px;font-weight:750;outline:none;transition:border-color 180ms ease,box-shadow 180ms ease,background 180ms ease}
#invoiceSection #paymentSelect:focus,#invoiceSection #paymentProof:focus,#invoiceSection #updatePaymentForm select:focus,#invoiceSection #updatePaymentForm input[type="file"]:focus{border-color:var(--u8k-primary);background:#fff;box-shadow:0 0 0 3px rgba(0,85,218,.12)}
#invoiceSection #paymentProof::file-selector-button,#invoiceSection #updatePaymentForm input[type="file"]::file-selector-button{margin-right:10px;border:0;border-radius:999px;background:var(--u8k-primary-soft);color:var(--u8k-primary);padding:8px 11px;font-weight:800;cursor:pointer}
#invoiceSection .old-proof{overflow:hidden;border-radius:12px;border:1px solid var(--u8k-border);background:#f8fbff;padding:8px}
#invoiceSection #submitPayment,#invoiceSection #updatePaymentForm button[type="submit"],#invoiceSection #updatePaymentForm input[type="submit"]{display:inline-flex;align-items:center;justify-content:center;width:100%;min-height:46px;border:0;border-radius:999px;background:linear-gradient(135deg,var(--u8k-primary) 0%,var(--u8k-primary-dark) 100%);color:#fff;padding:11px 16px;font-size:14px;font-weight:900;letter-spacing:.01em;cursor:pointer;box-shadow:0 10px 22px rgba(0,85,218,.18);transition:transform 180ms ease,box-shadow 180ms ease,opacity 180ms ease}
#invoiceSection #submitPayment:hover,#invoiceSection #updatePaymentForm button[type="submit"]:hover,#invoiceSection #updatePaymentForm input[type="submit"]:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(0,85,218,.24)}
#invoiceSection #submitPayment:disabled,#invoiceSection #updatePaymentForm button[type="submit"]:disabled,#invoiceSection #updatePaymentForm input[type="submit"]:disabled{cursor:not-allowed;opacity:.65;transform:none}
@media (min-width:720px){#invoiceSection #payment,#invoiceSection #uploade{grid-template-columns:150px 1fr;align-items:center}#invoiceSection #updatePaymentForm{padding:18px;gap:14px;border-radius:22px}}
@media (max-width:520px){#invoiceSection #updatePaymentForm{max-width:100%;padding:12px;gap:10px;border-radius:16px;box-shadow:0 8px 18px rgba(15,23,42,.05)}#invoiceSection #payment,#invoiceSection #uploade{padding:10px;border-radius:14px}#invoiceSection #paymentSelect,#invoiceSection #paymentProof,#invoiceSection #updatePaymentForm select,#invoiceSection #updatePaymentForm input[type="file"]{min-height:40px;border-radius:12px;font-size:13px;padding:8px 10px}#invoiceSection #submitPayment,#invoiceSection #updatePaymentForm button[type="submit"],#invoiceSection #updatePaymentForm input[type="submit"]{min-height:44px;padding:10px 14px}#invoiceSection #updatePaymentForm::before{font-size:9px;padding:5px 9px}}

/* Compact subscription and reseller hero blocks */
@media (max-width:1023px){
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type>div.grid>div:first-child,
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type>div.grid>div:first-child{padding:18px!important}
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1,
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1{margin-top:14px!important;font-size:30px!important;line-height:1.08!important}
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p,
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p{margin-top:10px!important;font-size:14px!important;line-height:1.55!important}
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p+div,
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p+div{margin-top:14px!important;gap:8px!important}
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p+div a,
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p+div a{padding:10px 18px!important}
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p+div+div,
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p+div+div{display:none!important}
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type>div.grid>div:nth-child(2),
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type>div.grid>div:nth-child(2){padding:14px!important}
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type>div.grid>div:nth-child(2)>div,
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type>div.grid>div:nth-child(2)>div{padding:16px!important;border-radius:24px!important}
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type>div.grid>div:nth-child(2) h2,
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type>div.grid>div:nth-child(2) h2{font-size:22px!important;line-height:1.2!important}
}
@media (min-width:1024px){
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type>div.grid>div:first-child,
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type>div.grid>div:first-child{padding:28px!important}
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1,
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1{margin-top:18px!important;font-size:44px!important;line-height:1.08!important}
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p,
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p{margin-top:14px!important;line-height:1.6!important}
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p+div,
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p+div,
  body:has(#u8kPlansGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p+div+div,
  body:has(#u8kCreditsGrid) section.bg-white>div.mx-auto.max-w-7xl>div:first-of-type h1+p+div+div{margin-top:18px!important}
}