/* GeneratePress Child – Udhar Khata App UI
   APK-like, Mobile-first, RTL ready
-------------------------------------------------- */
:root{
  --gp-sukp-color:#0a8fd8;
  --gp-sukp-color-600:#0771ab;
  --gp-sukp-bg:#f4f6f9;
  --gp-sukp-card:#ffffff;
  --gp-sukp-text:#0f172a;
  --gp-sukp-muted:#64748b;
  --gp-sukp-border:#e5e7eb;
  --gp-sukp-radius:18px;
  --gp-sukp-shadow:0 6px 22px rgba(2,16,35,.07);
}
body.gp-sukp-app{
  background:var(--gp-sukp-bg);
  color:var(--gp-sukp-text);
  -webkit-font-smoothing:antialiased;
}
body.gp-sukp-app .site-header,
body.gp-sukp-app .site-footer,
body.gp-sukp-app .generate-back-to-top,
body.gp-sukp-app .gp-sukp-hide { display:none !important; }
body.gp-sukp-app .site-content { padding:0 !important; }
body.gp-sukp-app .content-area { width:100% !important; margin:0 !important; }
body.gp-sukp-app .inside-article { padding:0 !important; background:transparent !important; }
body.gp-sukp-app .entry-header { display:none; }
body.gp-sukp-app .separate-containers .inside-article { box-shadow:none; }

/* App Shell */
.gp-sukp-app-shell { min-height:100dvh; display:flex; flex-direction:column; background:var(--gp-sukp-bg); }
.gp-sukp-topbar{
  position:sticky; top:0; z-index:80;
  background:var(--gp-sukp-color); color:#fff;
  box-shadow:0 2px 14px rgba(0,0,0,.12);
  padding-top:env(safe-area-inset-top);
}
.gp-sukp-topbar-inner{
  max-width:980px; margin:0 auto;
  display:flex; align-items:center; gap:12px;
  padding:12px 14px;
}
.gp-sukp-hamburger{
  background:rgba(255,255,255,.16); border:0; color:#fff;
  font-size:20px; width:40px; height:40px; border-radius:12px; cursor:pointer;
}
.gp-sukp-brand{ font-weight:800; font-size:18px; display:flex; align-items:center; gap:9px; flex:1; }
.gp-sukp-brand img{ height:28px; border-radius:7px; background:#fff; padding:2px; }
.gp-sukp-top-link{ color:#fff; text-decoration:none; font-size:18px; opacity:.95 }

.gp-sukp-main{ flex:1; padding:14px 12px 88px; max-width:980px; margin:0 auto; width:100%; box-sizing:border-box; }

/* Drawer */
.gp-sukp-drawer{
  position:fixed; inset:0 auto 0 0; width:290px; max-width:84vw;
  background:#fff; z-index:120; transform:translateX(-100%);
  transition:transform .25s ease;
  box-shadow: 20px 0 40px rgba(0,0,0,.18);
  padding-top:env(safe-area-inset-top);
}
.rtl .gp-sukp-drawer{ inset:0 0 0 auto; transform:translateX(100%); }
body.gp-sukp-drawer-open .gp-sukp-drawer{ transform:translateX(0); }
.gp-sukp-drawer-head{
  padding:18px 16px; font-weight:800; font-size:18px; color:#fff; background:var(--gp-sukp-color);
}
.gp-sukp-drawer-menu{ list-style:none; margin:0; padding:8px }
.gp-sukp-drawer-menu li a{
  display:block; padding:13px 12px; border-radius:12px; text-decoration:none; color:#0f172a; font-weight:600;
}
.gp-sukp-drawer-menu li a:hover{ background:#f1f5f9 }
.gp-sukp-drawer-backdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.38); z-index:115; display:none;
}
body.gp-sukp-drawer-open .gp-sukp-drawer-backdrop{ display:block; }

/* Bottom Nav – APK style */
.gp-sukp-bottomnav{
  position:fixed; bottom:0; left:0; right:0; z-index:90;
  background:#ffffffee; backdrop-filter: blur(10px);
  border-top:1px solid var(--gp-sukp-border);
  display:flex; justify-content:space-around; gap:4px;
  padding:8px 6px calc(8px + env(safe-area-inset-bottom));
  box-shadow:0 -6px 24px rgba(0,0,0,.06);
}
.gp-sukp-bn-item{
  flex:1; text-align:center; text-decoration:none; color:#475569;
  font-size:11px; font-weight:600; padding:4px 4px; border-radius:12px;
}
.gp-sukp-bn-item .i{ display:block; font-size:20px; line-height:1.2 }
.gp-sukp-bn-item.active{ color:var(--gp-sukp-color); background:#eaf6ff; }

/* Enhance SUKP plugin UI */
body.gp-sukp-app .sukp-wrap{ font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
body.gp-sukp-app .sukp-container{ max-width:980px; padding:0 }
body.gp-sukp-app .sukp-app-shell{ border:0; background:transparent; box-shadow:none; }
body.gp-sukp-app .sukp-app-header{
  background:transparent; color:var(--gp-sukp-text); padding:6px 2px 12px; font-size:20px; font-weight:800;
}
body.gp-sukp-app .sukp-app-body{ padding:0 }
body.gp-sukp-app .sukp-card{
  background:var(--gp-sukp-card);
  border:1px solid var(--gp-sukp-border);
  border-radius:var(--gp-sukp-radius);
  box-shadow:var(--gp-sukp-shadow);
  padding:16px;
  margin-bottom:14px;
}
body.gp-sukp-app .sukp-grid{ display:grid; gap:12px }
body.gp-sukp-app .sukp-grid-4{ grid-template-columns:repeat(2,minmax(0,1fr)) }
@media(min-width:700px){ body.gp-sukp-app .sukp-grid-4{ grid-template-columns:repeat(4,minmax(0,1fr)) } }
body.gp-sukp-app .sukp-kpi h3{ color:var(--gp-sukp-muted); font-size:11px; text-transform:uppercase; letter-spacing:.05em; margin:0 0 6px }
body.gp-sukp-app .sukp-kpi .v{ font-size:24px; font-weight:800 }
body.gp-sukp-app .sukp-btn{
  background:var(--gp-sukp-color); color:#fff; border:0; border-radius:14px;
  padding:11px 16px; font-weight:700; cursor:pointer; text-decoration:none; display:inline-block;
  box-shadow:0 6px 16px rgba(10,143,216,.28);
  transition:transform .06s ease;
}
body.gp-sukp-app .sukp-btn:active{ transform:translateY(1px) }
body.gp-sukp-app .sukp-btn.secondary{ background:#e6eef5; color:#0f172a; box-shadow:none }
body.gp-sukp-app .sukp-btn.sm{ padding:8px 12px; font-size:13px; border-radius:12px }
body.gp-sukp-app .sukp-input, body.gp-sukp-app .sukp-select, body.gp-sukp-app .sukp-textarea{
  width:100%; border:1.5px solid #d7dde5; border-radius:13px; padding:12px 13px; background:#fff;
  font-size:15px; outline:none;
}
body.gp-sukp-app .sukp-input:focus, body.gp-sukp-app .sukp-select:focus, body.gp-sukp-app .sukp-textarea:focus{
  border-color:var(--gp-sukp-color); box-shadow:0 0 0 3px rgba(10,143,216,.18)
}
body.gp-sukp-app .sukp-table{ width:100%; border-collapse:separate; border-spacing:0 }
body.gp-sukp-app .sukp-table th{ font-size:11px; text-transform:uppercase; color:#64748b; font-weight:700; padding:10px; border-bottom:1px solid var(--gp-sukp-border); text-align:left }
body.gp-sukp-app .sukp-table td{ padding:12px 10px; border-bottom:1px solid #f0f2f5; font-size:14px }
body.gp-sukp-app .sukp-badge{
  background:#e6f5ff; color:#0369a1; border-radius:999px; padding:4px 10px; font-size:12px; font-weight:700;
}
body.gp-sukp-app .sukp-badge.red{ background:#fff1f2; color:#be123c }
body.gp-sukp-app .sukp-badge.green{ background:#ecfdf5; color:#047857 }
body.gp-sukp-app .sukp-toolbar{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin-bottom:10px }
body.gp-sukp-app .sukp-right{ margin-left:auto }
body.gp-sukp-app .sukp-muted{ color:var(--gp-sukp-muted); font-size:13px }
@media(max-width:640px){
  body.gp-sukp-app .sukp-flex{ flex-direction:column; align-items:stretch }
  body.gp-sukp-app .sukp-table{ display:block; overflow-x:auto; white-space:nowrap }
}
body.gp-sukp-app .sukp-shortcode-box{
  background:#f8fafc; border:1px dashed #cbd5e1; border-radius:12px; padding:10px;
}
.rtl body.gp-sukp-app .sukp-table th,
.rtl body.gp-sukp-app .sukp-table td{ text-align:right }
.rtl .gp-sukp-topbar-inner{ flex-direction:row-reverse }
.gp-sukp-pagewrap{ animation:gpSukpIn .22s ease }
@keyframes gpSukpIn{ from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:none} }
body.gp-sukp-app .entry-meta, body.gp-sukp-app .post-navigation, body.gp-sukp-app .comments-area { display:none }
body.gp-sukp-theme a{ color:var(--gp-sukp-color) }
/* PWA install bar */
.gp-sukp-installbar{
  position:fixed; left:12px; right:12px; bottom:74px; z-index:85;
  background:#0f172a; color:#fff; border-radius:16px; padding:12px 14px;
  display:flex; align-items:center; gap:10px; box-shadow:0 12px 30px rgba(0,0,0,.25);
}
.gp-sukp-installbar button{ background:#fff; color:#0f172a; border:0; border-radius:10px; padding:8px 12px; font-weight:700; cursor:pointer }
.gp-sukp-installbar .x{ background:transparent; color:#fff; margin-left:auto; font-size:18px }
body.gp-sukp-app .sukp-sticky-bottom{
  position:sticky; bottom:74px; background:#fff; border:1px solid var(--gp-sukp-border);
  border-radius:14px; box-shadow:0 10px 30px rgba(0,0,0,.08); padding:10px; z-index:40;
}
