/*
Theme Name: OneKlik RSKesrem Lhokseumawe
Theme URI: https://oneklik.rskesremlhokseumawe.com
Author: RSKesrem Lhokseumawe
Description: Theme frontend untuk portal OneKlik dan dashboard layanan rumah sakit.
Version: 0.1.0
Requires at least: 6.4
Requires PHP: 8.1
Text Domain: oneklik-rskesrem-theme
*/

:root{--ok-blue:#0d6ead;--ok-blue-dark:#07568e;--ok-blue-soft:#e9f4fc;--ok-green:#13a979;--ok-ink:#162235;--ok-muted:#6b7788;--ok-line:#e6edf4;--ok-paper:#fff;--ok-bg:#f4f8fb;--ok-red:#d83c4b;--ok-shadow:0 18px 44px rgba(25,58,86,.11);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--ok-bg);color:var(--ok-ink)}button,input,select,textarea{font:inherit}.ok-shell{min-height:100vh}.ok-topbar{height:70px;background:#fff;border-bottom:1px solid var(--ok-line);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(18px,4vw,62px);position:sticky;top:0;z-index:20}.ok-brand{display:flex;align-items:center;gap:11px;font-weight:800;color:var(--ok-blue-dark);text-decoration:none}.ok-brand-mark{display:grid;place-items:center;width:36px;height:36px;color:#fff;background:linear-gradient(135deg,#1688c9,#0b5a9a);border-radius:11px;font-weight:900}.ok-container{width:min(1180px,calc(100% - 36px));margin:auto}.ok-hero{margin:28px 0 22px;padding:clamp(26px,5vw,56px);color:#fff;border-radius:24px;background:radial-gradient(circle at 90% -20%,#48a7d9 0 18%,transparent 19%),linear-gradient(125deg,#0d76b7,#07568e);box-shadow:var(--ok-shadow)}.ok-hero h1{font-size:clamp(1.8rem,4vw,3.2rem);margin:0 0 9px}.ok-hero p{max-width:660px;margin:0;color:#dceef9;font-size:1.06rem}.ok-directory-toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin:25px 0}.ok-search{min-width:min(100%,410px);border:1px solid var(--ok-line);border-radius:12px;background:#fff;padding:13px 15px;color:var(--ok-ink);outline:none}.ok-search:focus{border-color:var(--ok-blue);box-shadow:0 0 0 3px rgba(13,110,173,.14)}.ok-view-switch{display:flex;border:1px solid var(--ok-line);border-radius:10px;overflow:hidden;background:#fff}.ok-view-switch button{border:0;background:transparent;padding:10px 14px;cursor:pointer;color:var(--ok-muted)}.ok-view-switch button.is-active{background:var(--ok-blue);color:#fff}.ok-service-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;padding-bottom:48px}.ok-service-grid.is-list{grid-template-columns:1fr}.ok-service-card{background:#fff;border:1px solid var(--ok-line);border-radius:18px;padding:20px;box-shadow:0 5px 18px rgba(24,58,91,.05);display:flex;flex-direction:column;align-items:flex-start;gap:14px;transition:transform .2s,box-shadow .2s}.ok-service-card:hover{transform:translateY(-3px);box-shadow:var(--ok-shadow)}.is-list .ok-service-card{display:grid;grid-template-columns:52px 1fr auto;align-items:center}.ok-service-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;color:var(--ok-blue);background:var(--ok-blue-soft);font-size:1.25rem;font-weight:800;overflow:hidden}.ok-service-icon img{width:100%;height:100%;object-fit:cover}.ok-service-card h2{font-size:1.08rem;margin:0}.ok-service-card p{font-size:.9rem;color:var(--ok-muted);margin:0;line-height:1.55}.ok-button{border:0;border-radius:10px;background:var(--ok-blue);color:#fff;font-weight:700;padding:11px 15px;cursor:pointer;text-decoration:none}.ok-button:hover{background:var(--ok-blue-dark)}.ok-empty{grid-column:1/-1;text-align:center;background:#fff;border:1px dashed var(--ok-line);border-radius:16px;padding:36px;color:var(--ok-muted)}
.ok-modal[hidden]{display:none}.ok-modal{position:fixed;inset:0;z-index:50;background:rgba(11,31,49,.55);display:grid;place-items:center;padding:18px}.ok-modal-box{background:#fff;border-radius:20px;width:min(420px,100%);padding:32px;text-align:center;box-shadow:0 25px 80px rgba(0,0,0,.25)}.ok-spinner{width:48px;height:48px;border:4px solid #dcecf7;border-top-color:var(--ok-blue);border-radius:50%;margin:0 auto 18px;animation:ok-spin .9s linear infinite}.ok-progress{height:8px;background:#e8eff5;border-radius:99px;overflow:hidden;margin-top:18px}.ok-progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--ok-blue),var(--ok-green));transition:width .2s}@keyframes ok-spin{to{transform:rotate(360deg)}}
.ok-admin{display:grid;grid-template-columns:240px 1fr;min-height:100vh}.ok-sidebar{background:linear-gradient(180deg,#1077b9,#07568e);color:#d9edfc;padding:24px 14px;display:flex;flex-direction:column;gap:20px}.ok-sidebar .ok-brand{color:#fff}.ok-menu{display:grid;gap:6px}.ok-menu a{color:#d9edfc;text-decoration:none;padding:11px 12px;border-radius:9px;font-size:.93rem}.ok-menu a.is-active,.ok-menu a:hover{background:rgba(255,255,255,.16);color:#fff}.ok-sidebar-foot{margin-top:auto;font-size:.8rem;color:#c8e4f8}.ok-dashboard-main{padding:32px clamp(18px,3vw,46px);min-width:0}.ok-dashboard-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.ok-dashboard-header h1{margin:0;font-size:1.7rem}.ok-dashboard-header p{margin:5px 0 0;color:var(--ok-muted)}.ok-user{color:var(--ok-muted);font-size:.9rem}.ok-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px}.ok-stat{background:#fff;border:1px solid var(--ok-line);border-radius:16px;padding:18px}.ok-stat b{display:block;margin:8px 0 3px;font-size:1.65rem}.ok-stat span{font-size:.86rem;color:var(--ok-muted)}.ok-stat i{display:grid;place-items:center;width:32px;height:32px;background:var(--ok-blue-soft);color:var(--ok-blue);border-radius:9px;font-style:normal}.ok-panel{background:#fff;border:1px solid var(--ok-line);border-radius:17px;padding:22px;overflow:auto}.ok-panel h2{font-size:1.05rem;margin:0 0 5px}.ok-panel-sub{color:var(--ok-muted);font-size:.88rem;margin:0 0 18px}.ok-filter{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:17px}.ok-filter input,.ok-filter select{border:1px solid var(--ok-line);border-radius:9px;padding:9px;max-width:200px}.ok-table{width:100%;border-collapse:collapse;font-size:.88rem}.ok-table th{text-align:left;color:var(--ok-muted);font-weight:650;background:#f8fbfd}.ok-table th,.ok-table td{padding:12px 10px;border-bottom:1px solid var(--ok-line);white-space:nowrap}.ok-status{display:inline-flex;border-radius:99px;padding:5px 9px;font-size:.77rem;font-weight:750;background:#eef3f6;color:#546170}.ok-status--baru{background:#e7f3fd;color:#1070af}.ok-status--diproses{background:#fff2db;color:#a96408}.ok-status--selesai{background:#e8f8f1;color:#098457}.ok-status--ditolak{background:#fee9eb;color:#be2f43}.ok-login-wrap{min-height:100vh;display:grid;place-items:center;padding:22px;background:linear-gradient(135deg,rgba(4,74,125,.9),rgba(9,125,184,.72)),radial-gradient(circle at 78% 20%,rgba(148,227,255,.6),transparent 26%)}.ok-login-card{background:#fff;width:min(430px,100%);padding:38px;border-radius:20px;box-shadow:0 28px 80px rgba(2,35,58,.28)}.ok-login-card h1{margin:18px 0 7px;font-size:1.5rem}.ok-login-card p{color:var(--ok-muted);line-height:1.55}.ok-login-card label{display:block;margin:14px 0 6px;font-size:.88rem;font-weight:700}.ok-login-card input[type=text],.ok-login-card input[type=password]{width:100%;padding:12px;border:1px solid var(--ok-line);border-radius:9px}.ok-login-card .login-submit input{border:0;background:var(--ok-blue);color:#fff;border-radius:9px;padding:11px 16px;font-weight:700}.ok-notice{padding:12px 14px;background:#eaf6fe;color:#07568e;border-radius:10px;margin-bottom:16px;font-size:.9rem}
@media(max-width:880px){.ok-admin{grid-template-columns:1fr}.ok-sidebar{padding:14px 18px;flex-direction:row;align-items:center;overflow:auto}.ok-sidebar-foot{display:none}.ok-menu{display:flex;min-width:max-content}.ok-menu a{padding:8px}.ok-dashboard-main{padding:22px 18px}.ok-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:580px){.ok-topbar{height:62px}.ok-container{width:min(100% - 24px,1180px)}.ok-hero{border-radius:18px;margin-top:16px}.is-list .ok-service-card{grid-template-columns:48px 1fr}.is-list .ok-service-card .ok-button{grid-column:1/-1;width:100%;text-align:center}.ok-dashboard-header{align-items:flex-start;flex-direction:column}.ok-stat-grid{gap:10px}.ok-stat{padding:14px}.ok-stat b{font-size:1.35rem}.ok-filter input,.ok-filter select{max-width:100%;width:100%}}