/* Shared Wake Up Team interaction language: warm action cues, clear focus, and help. */
:root{
  --action-orange:#e96b22;
  --action-red:#c93646;
  --action-ink:#172954;
  --action-warm:#fff3e9;
}

body{background:#f5f6fb}
:where(a,button,summary,[role="button"]){-webkit-tap-highlight-color:transparent}
:where(a,button,summary,[role="button"]):focus-visible{outline:3px solid var(--action-orange);outline-offset:3px}
:where(button,[role="button"]):not(:disabled){cursor:pointer}
:where(button,[role="button"]):disabled{cursor:not-allowed;opacity:.68}

.nav-links a:hover,.nav-links a:focus-visible{
  background:var(--action-warm);color:#9c341f;border-bottom-color:var(--action-orange);
}
.nav-links a.active{background:#fff1e8;color:#98331e;border-bottom-color:var(--action-orange)}
.nav-user:hover,.nav-user:focus-visible{border-color:var(--action-orange);background:#fff8f2}
.mobile-nav a:hover,.mobile-nav a:focus-visible{background:rgba(233,107,34,.22)}

.btn,.vr-btn,.club .action,.club-nav a,.ops-button{
  transition:transform .18s ease,background .18s ease,border-color .18s ease,
             color .18s ease,box-shadow .18s ease,filter .18s ease;
}
.btn:hover,.vr-btn:hover,.club .action:hover,.ops-button:hover{
  transform:translateY(-2px);box-shadow:0 9px 23px rgba(173,69,39,.20);
}
.btn:active,.vr-btn:active,.club .action:active,.ops-button:active{transform:translateY(0)}
.btn-outline:hover,.btn-ghost:hover{border-color:var(--action-orange);background:#fff1e8;color:#8f301d}
.btn-orange,.btn-primary{background:linear-gradient(135deg,#f48931,#dc4f25);color:#fff}
.btn-orange:hover,.btn-primary:hover{filter:saturate(1.12)}
.btn-red:hover{background:#ad2537}
:where(.form-input,input:not([type=checkbox]):not([type=radio]),select,textarea):focus-visible{
  outline:2px solid var(--action-orange);outline-offset:2px;
}

/* Admin navigation is legible at rest and visibly reacts before a click. */
.admin-sidebar{background:linear-gradient(180deg,#142a5b 0%,#19396e 58%,#6b2f45 100%)}
.admin-sidebar .sidebar-label{color:#d4e1f4}
.admin-sidebar .sidebar-link{color:#edf4ff}
.admin-sidebar .sidebar-link:hover,.admin-sidebar .sidebar-link:focus-visible{
  background:rgba(255,139,74,.20);color:#fff;border-left-color:#ff9c50;
}
.admin-sidebar .sidebar-link.active{
  background:linear-gradient(90deg,rgba(233,107,34,.36),rgba(201,54,70,.20));
  border-left-color:#ffae63;color:#fff;
}
.admin-sidebar .sidebar-group{border-color:rgba(255,196,146,.24)}
.admin-sidebar .sidebar-group>summary:hover{background:rgba(255,139,74,.18)}
.admin-sidebar form button.sidebar-link:hover{background:#aa3546}
.admin-main .admin-page-sub{color:#4e607d}
.admin-main .admin-card,.admin-main .stat-card{
  border-color:#d5e0ef;
}
.admin-main .admin-table tbody tr:hover td{background:#fff6ef}
.admin-main :where(.admin-card,.stat-card) a:not(.btn):hover{color:#b44728}
.admin-main .form-input:focus{border-color:var(--action-orange);box-shadow:0 0 0 3px rgba(233,107,34,.14)}
.admin-main .btn-primary{background:linear-gradient(135deg,#ee792b,#d74832)}
.admin-main .club-tool form button:hover{background:#bf4c32}

/* Public cards advertise that their detail view is clickable. */
.event-card:hover,.news-card:hover,.reward-card:hover{
  border-color:#f0ae79;box-shadow:0 15px 34px rgba(112,55,46,.15);
}
.event-card,.news-card{border-top:3px solid #f0a66f}
.vr-card-home{border-top-color:#d74643}
.chip.active{background:#d94d36;border-color:#d94d36;color:#fff}
.chip:hover,.chip:focus-visible{background:#e96b22;border-color:#e96b22;color:#fff}
.section-title{border-left:4px solid #e96b22;padding-left:12px}
.event-card .btn:hover,.news-card .btn:hover{background:#d94f30;color:#fff}
.event-card-footer{border-top-color:#f0d9c8}
.event-card-title:hover{color:#a6402a}

/* Secondary systems share the same hover/focus signal without losing status colors. */
.club-nav a:hover,.club-nav a:focus-visible{background:#fff1e8;border-color:var(--action-orange);color:#91341e}
.vr-admin-subnav a:hover,.vr-admin-subnav a:focus-visible{background:#fff1e8;color:#94391e}
.vr-member-surface a:hover,.club a:hover{filter:saturate(1.08)}
.admin-main .vr-btn.action-edit:hover{filter:saturate(1.2)}
.admin-main .vr-btn.action-delete:hover{filter:saturate(1.2)}

.site-help-tooltip{
  position:fixed;z-index:2000;max-width:min(300px,calc(100vw - 24px));
  padding:10px 13px;border:1px solid #ffd0a8;border-radius:11px;
  background:#fffaf4;color:#63311d;box-shadow:0 12px 30px rgba(49,34,62,.20);
  font:600 .81rem/1.55 var(--font2);pointer-events:none;
  opacity:0;transform:translateY(5px);transition:opacity .12s ease,transform .12s ease;
  overflow-wrap:anywhere;
}
.site-help-tooltip.is-visible{opacity:1;transform:translateY(0)}
.site-help-tooltip::before{content:"คำแนะนำ";display:block;margin-bottom:3px;color:#bd4427;font:800 .67rem/1.2 var(--font);letter-spacing:.03em}

.page-guide{
  display:flex;align-items:flex-start;gap:12px;margin:0 0 22px;padding:14px 17px;
  border:1px solid #f3c49f;border-left:5px solid var(--action-orange);
  border-radius:13px;background:linear-gradient(105deg,#fff4e9,#fff9f5 70%,#fff);
  color:#653f2c;box-shadow:0 5px 18px rgba(148,68,31,.06);
}
.page-guide .page-guide-icon{flex:0 0 30px;display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#d84c36;color:#fff;font-weight:800}
.page-guide strong{display:block;color:#87321e;font:800 .88rem var(--font)}
.page-guide p{margin:2px 0 0;color:#684d40;font-size:.83rem;line-height:1.55}
.page-guide a{color:#a83d22;text-decoration:underline;text-underline-offset:2px;font-weight:700}

@media(max-width:768px){
  .site-help-tooltip{display:none}
  .page-guide{margin-bottom:16px;padding:12px 14px}
}
@media(prefers-reduced-motion:reduce){
  .btn,.vr-btn,.club .action,.club-nav a,.ops-button,.site-help-tooltip{transition:none}
  .btn:hover,.vr-btn:hover,.club .action:hover,.ops-button:hover{transform:none}
}
@media print{.page-guide,.site-help-tooltip{display:none!important}}