/* =========================================================================
   Phuket Care — Theme (Teal / Medical)
   Loaded after bootstrap.min.css to override the default look.
   ========================================================================= */
:root{
    --brand:        #2563eb;   /* blue-600 */
    --brand-dark:   #1d4ed8;   /* blue-700 */
    --brand-darker: #1e3a8a;   /* blue-800 */
    --brand-50:     #eff6ff;   /* blue-50 */
    --brand-100:    #dbeafe;   /* blue-100 */
    --accent:       #38bdf8;   /* sky-400 */

    --ink:    #0f172a;
    --body:   #334155;
    --muted:  #64748b;
    --line:   #e2e8f0;
    --bg:     #f5f7fa;
    --card:   #ffffff;

    --ring:   rgba(37,99,235,.22);
    --shadow-sm: 0 1px 2px rgba(15,23,42,.06), 0 1px 3px rgba(15,23,42,.05);
    --shadow:    0 4px 6px -2px rgba(15,23,42,.05), 0 12px 28px -6px rgba(15,23,42,.12);
    --shadow-lg: 0 18px 45px -12px rgba(37,99,235,.35);
    --radius: 16px;
}

/* ----- base ------------------------------------------------------------- */
body{
    font-family:'Sarabun',-apple-system,Segoe UI,sans-serif;
    color:var(--body);
    background:var(--bg);
    font-size:16px;
    line-height:1.65;
}
h1,h2,h3,h4,h5,h6,.font-head,.navbar-brand{
    font-family:'Sarabun',sans-serif;
    color:var(--ink);
    letter-spacing:-.01em;
}
a{color:var(--brand-dark);text-decoration:none}
a:hover{color:var(--brand-darker)}
.text-primary{color:var(--brand)!important}
.text-brand{color:var(--brand)!important}
.text-muted{color:var(--muted)!important}
hr{border-color:var(--line);opacity:1}

/* ----- top navbar ------------------------------------------------------- */
.pc-nav{
    background:rgba(255,255,255,.9);
    backdrop-filter:saturate(180%) blur(10px);
    border-bottom:1px solid var(--line);
    box-shadow:var(--shadow-sm);
}
.pc-nav .brand{display:flex;align-items:center;gap:.65rem;font-family:'Sarabun',sans-serif;font-weight:600;color:var(--ink)}
.pc-nav .brand img{height:42px}
.pc-nav .brand small{display:block;font-size:.72rem;color:var(--muted);font-weight:400;font-family:'Sarabun',sans-serif}
.pc-nav .nav-link{color:var(--body);font-weight:500;border-radius:9px;padding:.45rem .9rem!important}
.pc-nav .nav-link:hover{color:var(--brand-dark);background:var(--brand-50)}
.pc-nav .nav-link.active{color:var(--brand-dark);background:var(--brand-50);font-weight:600}

/* ----- hero ------------------------------------------------------------- */
.pc-hero{
    position:relative;overflow:hidden;color:#fff;
    background:linear-gradient(to right,var(--brand-darker) 0%,var(--brand) 55%,#3b82f6 100%);
}
.pc-hero::after{
    content:"";position:absolute;inset:0;opacity:.5;
    background:
        radial-gradient(620px 280px at 88% -10%,rgba(255,255,255,.20),transparent 60%),
        radial-gradient(420px 320px at 0% 120%,rgba(255,255,255,.12),transparent 60%);
}
.pc-hero > *{position:relative;z-index:1}
.pc-hero h1{color:#fff}
.pc-hero .lead{color:rgba(255,255,255,.9)}

/* ----- cards ------------------------------------------------------------ */
.card,.pc-card{
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow-sm);
    background:var(--card);
}
.card-header{background:#fff;border-bottom:1px solid var(--line)}
.shadow-sm{box-shadow:var(--shadow-sm)!important}
.shadow,.shadow-lg{box-shadow:var(--shadow)!important}
.bg-light{background:#fff!important}

.pc-tile{
    display:block;height:100%;border:1px solid var(--line);border-radius:var(--radius);
    background:#fff;padding:2rem 1.5rem;text-align:center;
    box-shadow:var(--shadow-sm);transition:transform .18s ease,box-shadow .18s ease,border-color .18s;
}
.pc-tile:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--brand-100)}
.pc-tile .ico{
    width:74px;height:74px;border-radius:20px;margin:0 auto 1rem;
    display:grid;place-items:center;font-size:1.9rem;color:var(--brand-dark);
    background:var(--brand-50);border:1px solid var(--brand-100);
}

/* icon chip used for section titles & stat cards */
.icon-chip{
    width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
    background:var(--brand-50);color:var(--brand-dark);font-size:1.15rem;border:1px solid var(--brand-100);
}

/* ----- buttons ---------------------------------------------------------- */
.btn{border-radius:11px;font-weight:600;padding:.55rem 1.25rem;font-family:'Sarabun',sans-serif}
.btn-lg{padding:.7rem 1.5rem}
.btn-brand,.btn-success{
    background:linear-gradient(135deg,var(--brand),var(--brand-dark));
    border:none;color:#fff;box-shadow:0 6px 16px -6px rgba(37,99,235,.6);
}
.btn-brand:hover,.btn-success:hover{
    background:linear-gradient(135deg,var(--brand-dark),var(--brand-darker));
    color:#fff;transform:translateY(-1px);box-shadow:0 10px 22px -8px rgba(37,99,235,.7);
}
.btn-primary{background:var(--brand);border-color:var(--brand)}
.btn-primary:hover{background:var(--brand-dark);border-color:var(--brand-dark)}
.btn-outline-primary,.btn-outline-brand{color:var(--brand-dark);border-color:var(--brand)}
.btn-outline-primary:hover,.btn-outline-brand:hover{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-light{background:#fff;border:1px solid var(--line)}
.btn-light:hover{background:var(--brand-50);border-color:var(--brand-100);color:var(--brand-dark)}

/* ----- forms ------------------------------------------------------------ */
.form-label,.col-form-label,legend{font-family:'Sarabun',sans-serif;font-weight:500;color:var(--ink)}
.form-control,.form-select{
    border:1px solid var(--line);border-radius:11px;padding:.6rem .85rem;color:var(--ink);background:#fff;
}
.form-control:focus,.form-select:focus{border-color:var(--brand);box-shadow:0 0 0 .22rem var(--ring)}
.form-control::placeholder{color:#94a3b8}
.input-group-text{border-radius:11px;border-color:var(--line);background:var(--brand-50);color:var(--brand-dark)}
.form-check-input:checked{background-color:var(--brand);border-color:var(--brand)}
.form-check-input:focus{border-color:var(--brand);box-shadow:0 0 0 .22rem var(--ring)}

/* grouped form section */
.form-section{border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem 1.25rem .25rem;margin-bottom:1.25rem;background:#fff}
.form-section > .sec-head{display:flex;align-items:center;gap:.6rem;margin:-.25rem 0 1rem}
.form-section > .sec-head h6{margin:0;font-weight:600}
.req::after{content:" *";color:#ef4444}

/* ----- tables ----------------------------------------------------------- */
.table{--bs-table-hover-bg:var(--brand-50)}
.table thead th{
    background:var(--brand-50);color:var(--brand-darker);
    font-family:'Sarabun',sans-serif;font-weight:600;border-bottom:1px solid var(--brand-100);
    white-space:nowrap;
}
.table > :not(caption) > * > *{padding:.7rem .75rem}
.badge{font-weight:600;border-radius:8px;padding:.4em .7em;font-family:'Sarabun',sans-serif}

/* ----- timeline (tracking) --------------------------------------------- */
.pc-timeline{list-style:none;margin:0;padding:0;position:relative}
.pc-timeline > li{position:relative;padding:0 0 1.35rem 2.4rem}
.pc-timeline > li::before{
    content:"";position:absolute;left:11px;top:1.7rem;bottom:-.2rem;width:2px;background:var(--line);
}
.pc-timeline > li:last-child::before{display:none}
.pc-timeline > li .dot{
    position:absolute;left:0;top:.1rem;width:24px;height:24px;border-radius:50%;
    background:var(--brand);color:#fff;display:grid;place-items:center;font-size:.7rem;
    box-shadow:0 0 0 4px var(--brand-50);
}

/* ----- description list ------------------------------------------------- */
dl.pc-dl dt{font-family:'Sarabun',sans-serif;font-weight:500;color:var(--muted)}
dl.pc-dl dd{color:var(--ink)}

/* ----- site footer ------------------------------------------------------ */
.site-footer{background:var(--brand-darker);color:rgba(255,255,255,.82);margin-top:3rem}
.site-footer h6{color:#fff;font-weight:600}
.site-footer a{color:rgba(255,255,255,.82)}
.site-footer a:hover{color:#fff}
.site-footer .bottom{background:rgba(0,0,0,.18);font-size:.85rem}

/* ----- back to top ------------------------------------------------------ */
.back-to-top{
    position:fixed;right:24px;bottom:24px;width:46px;height:46px;border-radius:50%;
    display:grid!important;place-items:center;z-index:1030;
    background:var(--brand);border:none;color:#fff;box-shadow:var(--shadow);
}
.back-to-top:hover{background:var(--brand-dark);color:#fff}

/* ----- admin layout ----------------------------------------------------- */
.admin-wrap{display:flex;min-height:100vh}
.admin-sidebar{
    width:256px;flex-shrink:0;color:#fff;
    background:linear-gradient(180deg,var(--brand-dark),var(--brand-darker));
}
.admin-sidebar .brand{font-family:'Sarabun',sans-serif;font-weight:600}
.admin-sidebar a.nav-link{color:rgba(255,255,255,.85);border-radius:10px;margin-bottom:.2rem;font-weight:500;padding:.6rem .85rem}
.admin-sidebar a.nav-link:hover{background:rgba(255,255,255,.12);color:#fff}
.admin-sidebar a.nav-link.active{background:rgba(255,255,255,.18);color:#fff;font-weight:600}
.admin-sidebar hr{border-color:rgba(255,255,255,.25)}
.admin-main{flex:1;min-width:0;background:var(--bg)}
.admin-main > .navbar{background:#fff;border-bottom:1px solid var(--line)}
.stat-card{border:1px solid var(--line);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow-sm);transition:transform .15s,box-shadow .15s}
.stat-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.admin-sidebar h1,.admin-sidebar h2,.admin-sidebar h3,.admin-sidebar h4,.admin-sidebar h5,.admin-sidebar h6{color:#fff}
.navbar-brand{font-weight:600;font-family:'Sarabun',sans-serif}
@media(max-width:768px){.admin-wrap{flex-direction:column}.admin-sidebar{width:100%}}
