/* useful.m50.ee — sunny modern theme */
:root{
  --sand-50:#fffaf0;
  --sand-100:#fff3dc;
  --sand-200:#ffe7b8;
  --sun:#f6b73c;
  --sun-deep:#e98a2b;
  --sun-soft:#ffd277;
  --ink:#1f1a14;
  --ink-soft:#5b5247;
  --line:rgba(31,26,20,.08);
  --card:#ffffff;
  --good:#3fa672;
  --bad:#d8554f;
  --shadow:0 10px 40px -18px rgba(60,40,10,.35);
  --radius:18px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body.app-body{
  font-family:'Inter',system-ui,sans-serif;
  background:linear-gradient(180deg,#fff7e3 0%,#fff3dc 35%,#fff8ec 100%);
  color:var(--ink);
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}

a{color:var(--sun-deep);text-decoration:none}
a:hover{color:var(--ink)}

/* Sun decoration */
.sun-bg{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.sun{
  position:absolute;top:-220px;right:-180px;width:560px;height:560px;border-radius:50%;
  background:radial-gradient(circle at 30% 30%,#ffe79e 0%,#ffc769 45%,#f6b73c 70%,rgba(246,183,60,0) 75%);
  filter:blur(2px);
}
.ray{position:absolute;border-radius:50%;filter:blur(60px);opacity:.55}
.ray-1{top:30%;left:-12%;width:520px;height:520px;background:#ffe1a3}
.ray-2{bottom:-12%;right:10%;width:600px;height:600px;background:#ffd8b3}
.ray-3{bottom:20%;left:30%;width:340px;height:340px;background:#fff0c1}

/* Topbar */
.topbar{
  position:relative;z-index:10;
  display:flex;align-items:center;gap:18px;
  padding:18px 36px;
  backdrop-filter:saturate(120%) blur(8px);
}
.brand{display:flex;align-items:baseline;gap:6px;color:var(--ink);font-family:'Fraunces',serif}
.brand-mark{
  display:inline-grid;place-items:center;width:38px;height:38px;border-radius:12px;
  background:linear-gradient(135deg,var(--sun) 0%,var(--sun-deep) 100%);
  color:#fff;font-weight:700;font-family:'Inter';font-size:18px;
  box-shadow:0 6px 18px -6px rgba(233,138,43,.6);
  position:relative;top:6px;
}
.brand-name{font-weight:700;font-size:22px;letter-spacing:-.5px}
.brand-dot{color:var(--sun-deep);margin:0 2px}
.brand-sub{font-size:14px;color:var(--ink-soft);font-family:'Inter';font-weight:500}
.nav-spacer{flex:1}
.nav-link{color:var(--ink-soft);font-weight:500;padding:8px 12px;border-radius:10px}
.nav-link:hover{background:rgba(31,26,20,.05);color:var(--ink)}
.nav-user{font-weight:500;color:var(--ink-soft);margin-right:6px}
.btn-pill{
  display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;
  background:linear-gradient(135deg,var(--sun) 0%,var(--sun-deep) 100%);color:#fff;font-weight:600;
  border:none;box-shadow:0 8px 22px -10px rgba(233,138,43,.7);transition:transform .15s ease;
}
.btn-pill:hover{color:#fff;transform:translateY(-1px)}
.btn-pill.ghost{background:transparent;color:var(--ink);box-shadow:none;border:1px solid var(--line)}
.btn-pill.ghost:hover{background:#fff}

/* Layout */
.main-wrap{position:relative;z-index:5;padding:8px 36px 60px}
.container-narrow{max-width:1080px;margin:0 auto}
.container-wide{max-width:1280px;margin:0 auto}

/* Cards */
.card-soft{
  background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:24px;border:1px solid var(--line);
}
.card-soft h2,.card-soft h3{font-family:'Fraunces',serif;font-weight:600;letter-spacing:-.3px;margin:0 0 12px}
.card-soft h2{font-size:24px}
.card-soft h3{font-size:18px}

/* Hero */
.hero{
  display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:center;
  padding:44px 0 24px;
}
.hero h1{font-family:'Fraunces',serif;font-weight:700;font-size:56px;line-height:1.05;letter-spacing:-1.2px;margin:0 0 18px}
.hero h1 em{font-style:italic;color:var(--sun-deep)}
.hero p{font-size:18px;color:var(--ink-soft);max-width:520px;margin:0 0 28px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}

/* Stat cards */
.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:24px 0}
.stat-card{background:#fff;border-radius:var(--radius);padding:22px;border:1px solid var(--line);box-shadow:var(--shadow)}
.stat-label{font-size:13px;text-transform:uppercase;letter-spacing:1px;color:var(--ink-soft);font-weight:600}
.stat-value{font-family:'Fraunces',serif;font-size:42px;font-weight:600;margin-top:6px;line-height:1}
.stat-value small{font-size:18px;color:var(--ink-soft);font-family:'Inter';font-weight:500;margin-left:6px}

.dash-grid{display:grid;grid-template-columns:2fr 1fr;gap:24px;align-items:start}
@media(max-width:900px){
  .dash-grid,.hero,.stat-row{grid-template-columns:1fr}
  .hero h1{font-size:40px}
  .main-wrap{padding:8px 18px 60px}
  .topbar{padding:14px 18px;flex-wrap:wrap}
}

/* Tools grid */
.tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin-top:14px}
.tool-card{
  background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;
  transition:transform .15s ease, box-shadow .15s ease; display:block;color:var(--ink);
}
.tool-card:hover{transform:translateY(-2px);box-shadow:var(--shadow);color:var(--ink)}
.tool-card .icon{font-size:26px;margin-bottom:6px}
.tool-card .name{font-weight:700;font-size:16px}
.tool-card .tagline{font-size:13px;color:var(--ink-soft);margin-top:4px;line-height:1.4}
.tool-card.disabled{opacity:.55;cursor:default}

/* Forms */
.form-control,.form-select,input.form-control{
  border-radius:12px;border:1px solid var(--line);padding:12px 14px;
  background:#fffdf7;font-size:15px;
}
.form-control:focus{border-color:var(--sun);box-shadow:0 0 0 4px rgba(246,183,60,.25);background:#fff}
label{font-weight:600;font-size:13px;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;display:block}

/* Tables */
.entry-table{width:100%;border-collapse:separate;border-spacing:0 6px}
.entry-table th{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--ink-soft);text-align:left;padding:6px 12px}
.entry-table tbody tr{background:#fff;box-shadow:0 2px 8px -4px rgba(60,40,10,.12)}
.entry-table tbody td{padding:14px 12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.entry-table tbody tr td:first-child{border-left:1px solid var(--line);border-top-left-radius:12px;border-bottom-left-radius:12px}
.entry-table tbody tr td:last-child{border-right:1px solid var(--line);border-top-right-radius:12px;border-bottom-right-radius:12px}
.pill{display:inline-block;padding:3px 10px;border-radius:999px;background:var(--sand-100);color:var(--ink);font-size:12px;font-weight:600}
.pill.open{background:#e6f6ed;color:var(--good)}

.row-actions{display:flex;gap:8px}
.btn-link-soft{color:var(--ink-soft);font-size:13px}
.btn-link-soft:hover{color:var(--bad)}

/* Toast */
.toast-stack{position:relative;z-index:9;margin:8px auto 0}
.toast-msg{background:#fff;border-left:4px solid var(--sun-deep);border-radius:10px;padding:12px 16px;margin-bottom:8px;box-shadow:var(--shadow)}
.toast-success{border-color:var(--good)}
.toast-error{border-color:var(--bad)}

/* Footer */
.foot{position:relative;z-index:5;text-align:center;padding:30px;color:var(--ink-soft);font-size:13px}
.foot .dot{margin:0 8px;color:var(--sun-deep)}

/* Auth pages */
.auth-card{max-width:440px;margin:60px auto;padding:36px;background:#fff;border-radius:20px;box-shadow:var(--shadow);border:1px solid var(--line)}
.auth-card h1{font-family:'Fraunces',serif;font-size:32px;margin:0 0 8px;font-weight:600}
.auth-card .sub{color:var(--ink-soft);margin-bottom:24px}
.auth-card form p{margin-bottom:14px}
.auth-card .extras{margin-top:16px;display:flex;justify-content:space-between;font-size:14px;color:var(--ink-soft)}

/* Quick checkin button */
.checkin-block{display:flex;gap:12px;align-items:center;margin-top:14px;flex-wrap:wrap}
.checkin-now{padding:14px 24px;font-size:16px}
.open-pill{padding:8px 14px;border-radius:999px;background:#e6f6ed;color:var(--good);font-weight:600;font-size:13px}

/* Language switcher */
.lang-switch{position:relative;margin-right:6px}
.lang-toggle{
  background:#fff;border:1px solid var(--line);border-radius:999px;
  padding:8px 14px;font-weight:600;font-size:13px;color:var(--ink);cursor:pointer;
}
.lang-toggle:hover{background:var(--sand-50)}
.lang-dropdown{
  position:absolute;right:0;top:calc(100% + 8px);
  background:#fff;border:1px solid var(--line);border-radius:14px;
  box-shadow:var(--shadow);padding:6px;min-width:160px;display:none;z-index:50;
}
.lang-dropdown.open{display:block}
.lang-dropdown form{margin:0}
.lang-option{
  width:100%;text-align:left;background:transparent;border:none;padding:10px 14px;
  border-radius:10px;cursor:pointer;font-size:14px;color:var(--ink);
}
.lang-option:hover{background:var(--sand-50)}

/* Profile menu */
.profile-menu{position:relative;margin-left:6px}
.profile-btn{
  display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);
  border-radius:999px;padding:6px 16px 6px 6px;cursor:pointer;
}
.profile-btn:hover{background:var(--sand-50)}
.avatar-img{width:36px;height:36px;border-radius:50%;object-fit:cover;display:block}
.avatar-img.big{width:54px;height:54px}
.avatar-initials{
  display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;
  background:linear-gradient(135deg,var(--sun) 0%,var(--sun-deep) 100%);color:#fff;font-weight:700;font-size:14px;
}
.avatar-initials.big{width:54px;height:54px;font-size:20px}
.profile-name-inline{font-weight:600;font-size:14px;color:var(--ink)}
@media(max-width:600px){.profile-name-inline{display:none}}
.profile-dropdown{
  position:absolute;right:0;top:calc(100% + 8px);background:#fff;border:1px solid var(--line);
  border-radius:16px;box-shadow:var(--shadow);padding:8px;min-width:280px;display:none;z-index:50;
}
.profile-dropdown.open{display:block}
.profile-head{display:flex;gap:12px;align-items:center;padding:10px 12px 14px;border-bottom:1px solid var(--line);margin-bottom:6px}
.profile-name{font-weight:700;font-size:15px}
.profile-email{font-size:12px;color:var(--ink-soft)}
.profile-item{
  display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;
  color:var(--ink);font-size:14px;text-decoration:none;
}
.profile-item:hover{background:var(--sand-50);color:var(--ink)}
.profile-item.danger{color:var(--bad)}
.profile-item .ico{width:22px;text-align:center}
.profile-divider{height:1px;background:var(--line);margin:6px 8px}

/* Pagination partial */
.pager{display:flex;gap:6px;justify-content:center;align-items:center;margin-top:18px;flex-wrap:wrap}
.pager a, .pager span{
  display:inline-block;padding:8px 14px;border-radius:10px;font-size:14px;
  background:#fff;border:1px solid var(--line);color:var(--ink);text-decoration:none;
}
.pager a:hover{background:var(--sand-50)}
.pager .current{background:linear-gradient(135deg,var(--sun) 0%,var(--sun-deep) 100%);color:#fff;border-color:transparent;font-weight:600}
.pager .gap{border:none;background:transparent;color:var(--ink-soft)}

/* Profile edit page */
.avatar-preview{width:120px;height:120px;border-radius:50%;object-fit:cover;display:block;border:3px solid #fff;box-shadow:var(--shadow)}
.avatar-preview-placeholder{width:120px;height:120px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,var(--sun-soft),var(--sun-deep));color:#fff;font-size:42px;font-weight:700;box-shadow:var(--shadow)}

/* Flatpickr theme tweaks */
.flatpickr-calendar{font-family:'Inter',sans-serif !important}
.flatpickr-day.selected,.flatpickr-day.selected:hover{background:var(--sun-deep) !important;border-color:var(--sun-deep) !important}
.flatpickr-day.today{border-color:var(--sun) !important;color:var(--sun-deep)}