
/* =========================================================
   UNDANGANKUUU APP THEMES
   Applies to app UI only. Public invitation/template pages
   intentionally do not load this stylesheet.
   ========================================================= */
:root{
  --uk-bg:#f2f5fa;
  --uk-surface:#ffffff;
  --uk-surface-2:#f8f9fc;
  --uk-text:#111827;
  --uk-muted:#667085;
  --uk-border:#dde3ec;
  --uk-field:#ffffff;
  --uk-shadow:0 18px 50px rgba(20,28,45,.09);
  --uk-accent:#6f43ef;
  --uk-accent-soft:#efe8ff;
  color-scheme:light;
}
:root[data-uk-theme="terang"]{
  --uk-bg:#f2f5fa; --uk-surface:#ffffff; --uk-surface-2:#f8f9fc;
  --uk-text:#111827; --uk-muted:#667085; --uk-border:#dde3ec;
  --uk-field:#ffffff; --uk-shadow:0 18px 50px rgba(20,28,45,.09);
  --uk-accent:#6f43ef; --uk-accent-soft:#efe8ff; color-scheme:light;
}
:root[data-uk-theme="gelap"]{
  --uk-bg:#080d17; --uk-surface:#101827; --uk-surface-2:#131d2e;
  --uk-text:#f6f3ff; --uk-muted:#9ea8b8; --uk-border:#28344a;
  --uk-field:#0d1523; --uk-shadow:0 20px 58px rgba(0,0,0,.34);
  --uk-accent:#8b6cff; --uk-accent-soft:#2d235d; color-scheme:dark;
}
:root[data-uk-theme="charcoal"]{
  --uk-bg:#101113; --uk-surface:#181a1f; --uk-surface-2:#1e2026;
  --uk-text:#f5f2f8; --uk-muted:#aaa6af; --uk-border:#303239;
  --uk-field:#15171b; --uk-shadow:0 20px 58px rgba(0,0,0,.38);
  --uk-accent:#8a6de9; --uk-accent-soft:#2a2142; color-scheme:dark;
}
:root[data-uk-theme="oled"]{
  --uk-bg:#000000; --uk-surface:#070707; --uk-surface-2:#0b0b0d;
  --uk-text:#ffffff; --uk-muted:#a6a6ad; --uk-border:#242429;
  --uk-field:#050505; --uk-shadow:0 20px 58px rgba(0,0,0,.72);
  --uk-accent:#8a6dff; --uk-accent-soft:#1d153e; color-scheme:dark;
}

html,body{transition:background-color .36s ease,color .36s ease}
body{background:var(--uk-bg)!important;color:var(--uk-text)!important}
.form-panel,.status-side,.section:not(.hero):not(.soft),.account-dropdown,
.card-shell,.auth-card,.modal,.panel,.box,.card,.inv-card,.editor-card,
.stat,.order-card,.summary-card,.payment-card{
  transition:background-color .36s ease,color .36s ease,border-color .36s ease,box-shadow .36s ease;
}
:root[data-uk-theme] .form-panel,
:root[data-uk-theme] .status-side{background:var(--uk-bg)!important}
:root[data-uk-theme] .card-shell,
:root[data-uk-theme] .auth-card,
:root[data-uk-theme] .account-dropdown,
:root[data-uk-theme] .modal,
:root[data-uk-theme] .panel,
:root[data-uk-theme] .inv-card,
:root[data-uk-theme] .editor-card{
  background:var(--uk-surface)!important;color:var(--uk-text)!important;border-color:var(--uk-border)!important;
  box-shadow:var(--uk-shadow);
}
:root[data-uk-theme] input,
:root[data-uk-theme] textarea,
:root[data-uk-theme] select{
  background:var(--uk-field)!important;color:var(--uk-text)!important;border-color:var(--uk-border)!important;
}
:root[data-uk-theme] input::placeholder,
:root[data-uk-theme] textarea::placeholder{color:var(--uk-muted)!important}
:root[data-uk-theme] .muted,
:root[data-uk-theme] #status,
:root[data-uk-theme] .back,
:root[data-uk-theme] .legal,
:root[data-uk-theme] .field label{color:var(--uk-muted)!important}
:root[data-uk-theme] .nav,
:root[data-uk-theme] header:not(.uk-theme-head){
  transition:background-color .36s ease,border-color .36s ease;
}
:root[data-uk-theme="gelap"] .nav,
:root[data-uk-theme="charcoal"] .nav,
:root[data-uk-theme="oled"] .nav{
  background:color-mix(in srgb,var(--uk-surface) 92%,transparent)!important;
  border-color:var(--uk-border)!important;
}
:root[data-uk-theme="gelap"] .nav a,
:root[data-uk-theme="charcoal"] .nav a,
:root[data-uk-theme="oled"] .nav a,
:root[data-uk-theme="gelap"] .brand,
:root[data-uk-theme="charcoal"] .brand,
:root[data-uk-theme="oled"] .brand{color:var(--uk-text)!important}

.uk-theme-switcher{
  position:fixed;left:max(12px,env(safe-area-inset-left));bottom:max(12px,env(safe-area-inset-bottom));
  z-index:2147482500;display:flex;align-items:center;gap:4px;padding:5px;
  border:1px solid var(--uk-border);border-radius:15px;background:color-mix(in srgb,var(--uk-surface) 92%,transparent);
  box-shadow:0 12px 32px rgba(0,0,0,.14);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  transform:translateY(0);transition:background .3s ease,border-color .3s ease,transform .25s ease;
}
.uk-theme-switcher:hover{transform:translateY(-2px)}
.uk-theme-switcher button{
  appearance:none;border:0;cursor:pointer;padding:8px 10px;border-radius:10px;background:transparent;
  color:var(--uk-muted);font:800 10px/1.1 Inter,ui-sans-serif,system-ui,sans-serif;white-space:nowrap;
  transition:background .24s ease,color .24s ease,transform .2s ease,box-shadow .24s ease;
}
.uk-theme-switcher button:hover{transform:translateY(-1px);color:var(--uk-text)}
.uk-theme-switcher button.active{
  color:#fff;background:var(--uk-accent-soft);box-shadow:inset 0 0 0 1px rgba(139,108,255,.14);
}
:root[data-uk-theme="terang"] .uk-theme-switcher button.active{color:#633ce4;background:#eee6ff}
:root[data-uk-theme="gelap"] .uk-theme-switcher button.active{background:#302568}
:root[data-uk-theme="charcoal"] .uk-theme-switcher button.active{background:#2c2247}
:root[data-uk-theme="oled"] .uk-theme-switcher button.active{background:#1f1741;border:1px solid #403565}
@media(max-width:640px){
  .uk-theme-switcher{left:8px;right:8px;bottom:max(8px,env(safe-area-inset-bottom));justify-content:center}
  .uk-theme-switcher button{flex:1;padding:8px 4px;font-size:9px}
}
@media(prefers-reduced-motion:reduce){
  html,body,.uk-theme-switcher,.uk-theme-switcher button{transition:none!important}
}
