/*!*********************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[15].oneOf[10].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[15].oneOf[10].use[3]!../../node_modules/@fontsource/noto-sans-thai/400.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************************/
/* noto-sans-thai-thai-400-normal */
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/_next/static/media/noto-sans-thai-thai-400-normal.0deeb29e.woff2) format('woff2'), url(/_next/static/media/noto-sans-thai-thai-400-normal.3a5d8780.woff) format('woff');
  unicode-range: U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC;
}

/* noto-sans-thai-latin-ext-400-normal */
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/_next/static/media/noto-sans-thai-latin-ext-400-normal.3589c6d9.woff2) format('woff2'), url(/_next/static/media/noto-sans-thai-latin-ext-400-normal.37fa23cf.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* noto-sans-thai-latin-400-normal */
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(/_next/static/media/noto-sans-thai-latin-400-normal.b6e916c2.woff2) format('woff2'), url(/_next/static/media/noto-sans-thai-latin-400-normal.e5ecb78a.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/*!*********************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[15].oneOf[10].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[15].oneOf[10].use[3]!../../node_modules/@fontsource/noto-sans-thai/600.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************************/
/* noto-sans-thai-thai-600-normal */
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/_next/static/media/noto-sans-thai-thai-600-normal.871a5c9f.woff2) format('woff2'), url(/_next/static/media/noto-sans-thai-thai-600-normal.2ce5631b.woff) format('woff');
  unicode-range: U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC;
}

/* noto-sans-thai-latin-ext-600-normal */
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/_next/static/media/noto-sans-thai-latin-ext-600-normal.5b0e8bdc.woff2) format('woff2'), url(/_next/static/media/noto-sans-thai-latin-ext-600-normal.919c1116.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* noto-sans-thai-latin-600-normal */
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(/_next/static/media/noto-sans-thai-latin-600-normal.5864c91b.woff2) format('woff2'), url(/_next/static/media/noto-sans-thai-latin-600-normal.5a7a54c8.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/*!*********************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[15].oneOf[10].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[15].oneOf[10].use[3]!../../node_modules/@fontsource/noto-sans-thai/700.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************************/
/* noto-sans-thai-thai-700-normal */
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/_next/static/media/noto-sans-thai-thai-700-normal.8ef05e6d.woff2) format('woff2'), url(/_next/static/media/noto-sans-thai-thai-700-normal.147ea1b0.woff) format('woff');
  unicode-range: U+02D7,U+0303,U+0331,U+0E01-0E5B,U+200C-200D,U+25CC;
}

/* noto-sans-thai-latin-ext-700-normal */
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/_next/static/media/noto-sans-thai-latin-ext-700-normal.013aa587.woff2) format('woff2'), url(/_next/static/media/noto-sans-thai-latin-ext-700-normal.8aa1a9e4.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* noto-sans-thai-latin-700-normal */
@font-face {
  font-family: 'Noto Sans Thai';
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url(/_next/static/media/noto-sans-thai-latin-700-normal.e92d438c.woff2) format('woff2'), url(/_next/static/media/noto-sans-thai-latin-700-normal.bed15659.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/*!********************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ../../node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[15].oneOf[10].use[2]!../../node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[15].oneOf[10].use[3]!./app/styles.css ***!
  \********************************************************************************************************************************************************************************************************************************************************************/
:root {
  color-scheme: light;
  --ink: #18392f;
  --muted: #61736d;
  --paper: #fffdf8;
  --leaf: #237a57;
  --leaf-dark: #185b40;
  --mint: #dff2e8;
  --peach: #fff0dc;
  --danger: #9e382f;
  --danger-bg: #fff0ee;
  font-family: "Noto Sans Thai", Tahoma, "Leelawadee UI", sans-serif;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  font-size: 17px;
  line-height: 1.6;
  background:
    radial-gradient(circle at 12% 10%, var(--peach) 0 12rem, transparent 12.1rem),
    radial-gradient(circle at 90% 92%, var(--mint) 0 15rem, transparent 15.1rem),
    #f5f3eb;
}

button, a { font: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible { outline: 4px solid #f2a07f; outline-offset: 2px; }

.shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.card {
  width: min(100%, 440px);
  padding: 36px 28px;
  border: 1px solid rgba(24, 57, 47, 0.08);
  border-radius: 28px;
  background: rgba(255, 253, 248, 0.94);
  box-shadow: 0 24px 70px rgba(39, 60, 50, 0.12);
}

.care-card { width: min(100%, 760px); padding: 32px; }

.hero { text-align: center; }

.brand-logo {
  width: 176px;
  height: 176px;
  display: block;
  object-fit: contain;
  margin: -18px auto 8px;
  border-radius: 24px;
}

.eyebrow {
  margin: 0 0 10px;
  color: var(--leaf);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .13em;
}

h1 { margin: 0; font-size: clamp(34px, 8vw, 48px); line-height: 1.25; letter-spacing: 0; }
.compact-title { font-size: clamp(32px, 7vw, 40px); }
.lede { margin: 22px auto 28px; color: var(--muted); font-size: 18px; line-height: 1.7; }

.primary-button, .secondary-button {
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 16px;
  padding: 13px 22px;
  cursor: pointer;
  text-decoration: none;
  font-weight: 750;
}

.primary-button { width: 100%; color: white; background: var(--leaf); }
.primary-button:hover { background: var(--leaf-dark); }
.login-form { width: 100%; margin: 0; }
.secondary-button { color: var(--ink); background: var(--mint); }
.privacy-note { margin: 28px 0 0; color: var(--muted); font-size: 13px; line-height: 1.6; }

.notice {
  margin: 24px 0;
  padding: 18px;
  border-radius: 16px;
  background: var(--mint);
  line-height: 1.6;
}

.notice .primary-button { margin-top: 10px; }
.error { color: var(--danger); background: var(--danger-bg); }
.login-panel { text-align: center; }
.dashboard { display: grid; gap: 22px; }
.profile-summary { display: flex; align-items: center; gap: 16px; padding-bottom: 20px; border-bottom: 1px solid #dce4df; }
.avatar { width: 64px; height: 64px; flex: 0 0 64px; display: grid; place-items: center; border-radius: 20px; color: white; background: var(--leaf); font-size: 27px; font-weight: 700; }
.profile-copy { min-width: 0; }
.profile-copy h1 { overflow: hidden; margin: 1px 0 3px; font-size: clamp(25px, 5vw, 34px); text-overflow: ellipsis; white-space: nowrap; }
.role-label, .section-kicker { margin: 0; color: var(--leaf); font-size: 13px; font-weight: 700; letter-spacing: .04em; }
.connection-status { display: flex; align-items: center; gap: 7px; margin: 0; color: var(--muted); font-size: 14px; }
.connection-status span { width: 8px; height: 8px; border-radius: 50%; background: #25a56a; }
.demo-banner { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border: 1px solid #f2d8ae; border-radius: 12px; color: #694f25; background: #fff8e8; font-size: 14px; }
.line-first-banner { display: grid; gap: 2px; padding: 14px 16px; border-left: 5px solid var(--leaf); border-radius: 12px; background: var(--mint); }
.line-first-banner span { color: var(--muted); font-size: 14px; }
.feedback { margin: 0; padding: 12px 16px; border-radius: 12px; color: var(--leaf-dark); background: var(--mint); font-weight: 700; }
.subject-card { display: grid; grid-template-columns: minmax(140px, .8fr) 1.4fr; gap: 22px; padding: 20px; border-radius: 18px; background: var(--mint); }
.subject-card h2 { margin: 4px 0 0; font-size: 25px; line-height: 1.3; }
.subject-facts { display: grid; gap: 10px; }
.subject-facts p { display: grid; margin: 0; }
.subject-facts span { color: var(--muted); font-size: 13px; }
.subject-facts strong { font-size: 15px; font-weight: 600; }
.dashboard-section, .feature-panel, .onboarding-panel { display: grid; gap: 18px; padding: 22px; border: 1px solid #dce4df; border-radius: 20px; background: white; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 12px; }
.section-heading h2, .feature-panel h2, .onboarding-panel h2 { margin: 2px 0 0; font-size: 26px; line-height: 1.35; }
.section-heading > span { color: var(--muted); font-size: 14px; }
.feature-panel > p { margin: 0; }
.status-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.status-item { min-width: 0; padding: 16px; border: 1px solid #dce4df; border-radius: 16px; background: #fffefb; }
.status-icon { display: block; color: var(--leaf); font-size: 24px; line-height: 1; }
.status-item h3 { margin: 12px 0 2px; font-size: 18px; line-height: 1.35; }
.status-item p { margin: 0; color: var(--muted); font-size: 14px; }
.quick-actions, .button-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.action-button, .quick-actions a, .download-button { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 13px; padding: 10px 18px; color: white; background: var(--leaf); cursor: pointer; font: inherit; font-weight: 700; text-align: center; text-decoration: none; }
.action-button:hover, .quick-actions a:hover, .download-button:hover { background: var(--leaf-dark); }
.action-button.compact { min-height: 44px; padding: 7px 14px; white-space: nowrap; }
.action-button.secondary { color: var(--leaf-dark); background: var(--mint); }
.action-button.ghost { color: var(--leaf-dark); border: 1px solid #aacabc; background: white; }
.action-button.danger, .quick-actions .danger-link { color: white; background: var(--danger); }
button:disabled { cursor: not-allowed; opacity: .55; }
.record-list { display: grid; gap: 10px; }
.record-list article { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 14px 16px; border: 1px solid #e1e7e3; border-radius: 14px; background: #faf9f5; }
.record-list article div { display: grid; gap: 2px; }
.record-list span, .record-list small { color: var(--muted); font-size: 14px; }
.form-stack { display: grid; gap: 18px; }
.simple-form { display: grid; gap: 14px; padding: 18px; border: 1px solid #dce4df; border-radius: 16px; background: #fafcfb; }
.form-heading h3 { margin: 0; font-size: 20px; }
.form-heading p { margin: 2px 0 0; color: var(--muted); font-size: 14px; }
.simple-form label { display: grid; gap: 7px; min-width: 0; }
.simple-form label > span { font-size: 15px; font-weight: 600; }
.simple-form input, .simple-form textarea { width: 100%; min-width: 0; min-height: 50px; border: 1.5px solid #aebeb6; border-radius: 11px; padding: 10px 12px; color: var(--ink); background: white; font: inherit; }
.simple-form input::placeholder, .simple-form textarea::placeholder { color: #84928c; }
.simple-form textarea { min-height: 100px; resize: vertical; }
.simple-form.two-columns { grid-template-columns: 1fr 1fr; }
.simple-form .full-row { grid-column: 1 / -1; }
.source-note { color: var(--muted); font-size: 14px; }
.urgent-panel { border-color: #e7aaa4; background: var(--danger-bg); }
.assistant-result { white-space: pre-line; padding: 16px; border-radius: 14px; background: var(--mint); }
.care-nav { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; padding-top: 18px; border-top: 1px solid #dce4df; }
.care-nav a { min-height: 68px; display: grid; place-items: center; align-content: center; gap: 5px; border-radius: 12px; color: var(--muted); text-decoration: none; font-size: 12px; font-weight: 700; text-align: center; }
.care-nav a > svg { width: 24px; height: 24px; color: var(--leaf); fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.care-nav a.active { color: white; background: var(--leaf); }
.care-nav a.active > svg { color: white; }
.utility-actions { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.utility-actions a { min-height: 76px; display: flex; align-items: center; gap: 12px; padding: 13px 15px; border: 1px solid #dce4df; border-radius: 15px; color: var(--ink); background: #fffefb; text-decoration: none; }
.utility-actions a:hover { border-color: #9abaaa; background: #f5fbf8; }
.utility-actions svg { width: 28px; height: 28px; flex: 0 0 28px; padding: 4px; border-radius: 8px; color: var(--leaf-dark); background: var(--mint); fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.utility-actions span { min-width: 0; display: grid; }
.utility-actions strong { font-size: 15px; line-height: 1.35; }
.utility-actions small { color: var(--muted); font-size: 12px; line-height: 1.45; }
.role-preview { overflow: hidden; border: 1px solid #e4e0d5; border-radius: 14px; background: #faf8f1; font-size: 14px; }
.role-preview summary { min-height: 58px; display: grid; position: relative; cursor: pointer; padding: 10px 48px 10px 15px; color: var(--ink); font-weight: 700; list-style: none; }
.role-preview summary::-webkit-details-marker { display: none; }
.role-preview summary::after { content: "+"; width: 26px; height: 26px; display: grid; position: absolute; top: 50%; right: 14px; place-items: center; border-radius: 50%; color: var(--leaf-dark); background: white; font-size: 20px; line-height: 1; transform: translateY(-50%); }
.role-preview[open] summary::after { content: "−"; }
.role-preview summary small { color: var(--muted); font-size: 12px; font-weight: 500; }
.role-preview div { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding: 0 12px 12px; }
.role-preview a { min-height: 42px; display: grid; place-items: center; padding: 7px 10px; border: 1px solid #dce4df; border-radius: 10px; color: var(--leaf-dark); background: white; font-weight: 700; text-align: center; text-decoration: none; }
.setup-list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.setup-list li { display: flex; align-items: center; gap: 10px; font-weight: 600; }
.setup-list li > span { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--leaf); }
.text-button { justify-self: center; min-height: 44px; border: 0; padding: 7px 16px; color: var(--muted); background: transparent; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }
.admin-card { width: min(100%, 960px); }
.doctor-card { width: min(100%, 780px); }
.access-card { width: min(100%, 520px); display: grid; gap: 18px; text-align: center; }
.access-card h1, .access-card p { margin: 0; }
.portal-header { display: flex; align-items: center; gap: 22px; padding-bottom: 24px; border-bottom: 1px solid #dce4df; }
.portal-header .brand-logo { width: 104px; height: 104px; flex: 0 0 104px; margin: 0; border-radius: 20px; }
.portal-header h1 { margin: 2px 0 4px; font-size: clamp(30px, 5vw, 44px); }
.portal-header p { margin: 0; color: var(--muted); }
.admin-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin: 24px 0; }
.admin-grid article { padding: 20px; border-radius: 16px; background: var(--mint); }
.admin-grid h2, .admin-grid p { margin: 0; }
.admin-grid article > span { color: var(--muted); font-size: 13px; }
.owner-boundary { padding: 20px; border: 1px solid #dce4df; border-radius: 16px; }
.owner-boundary h2 { margin: 0 0 8px; }
.owner-boundary p { margin: 4px 0; color: var(--muted); }
.empty-state { display: grid; place-items: center; gap: 8px; margin: 28px 0; padding: 42px 24px; border: 1px dashed #aebeb6; border-radius: 18px; text-align: center; }
.empty-state > span { color: var(--leaf); font-size: 42px; }
.empty-state h2, .empty-state p { margin: 0; }
.empty-state p { max-width: 520px; color: var(--muted); }
.text-link { display: inline-block; margin-top: 18px; color: var(--leaf-dark); text-underline-offset: 4px; }

@media (max-width: 480px) {
  body { font-size: 16px; background: var(--paper); }
  .shell { padding: 0; align-items: stretch; }
  .card { min-height: 100vh; padding: 24px 18px; border: 0; border-radius: 0; box-shadow: none; }
  .care-card { padding-bottom: 110px; }
  .care-card .brand-logo { width: 132px; height: 132px; margin-top: -10px; }
  .dashboard { gap: 18px; }
  .profile-summary { align-items: center; }
  .avatar { width: 56px; height: 56px; flex-basis: 56px; border-radius: 17px; font-size: 23px; }
  .profile-copy h1 { font-size: 25px; }
  .demo-banner { align-items: flex-start; flex-direction: column; gap: 0; }
  .subject-card { grid-template-columns: 1fr; gap: 14px; padding: 17px; }
  .subject-facts { grid-template-columns: 1fr 1fr; }
  .dashboard-section, .feature-panel, .onboarding-panel { padding: 17px; border-radius: 17px; }
  .section-heading { align-items: flex-start; flex-direction: column; gap: 2px; }
  .status-grid { grid-template-columns: 1fr; }
  .status-item { display: grid; grid-template-columns: 36px 1fr; column-gap: 8px; padding: 14px; }
  .status-icon { grid-row: 1 / 3; }
  .status-item h3 { margin: 0; }
  .quick-actions, .button-row { grid-template-columns: 1fr; }
  .utility-actions { grid-template-columns: 1fr; }
  .record-list article { align-items: stretch; flex-direction: column; }
  .action-button.compact { width: 100%; }
  .subject-facts { grid-template-columns: 1fr; }
  .care-nav { position: fixed; z-index: 10; right: 0; bottom: 0; left: 0; grid-template-columns: repeat(6, 1fr); gap: 2px; padding: 7px 6px max(7px, env(safe-area-inset-bottom)); border-top: 1px solid #dce4df; background: rgba(255, 253, 248, .98); box-shadow: 0 -8px 24px rgba(24, 57, 47, .08); }
  .care-nav a { min-height: 60px; padding: 4px 2px; gap: 2px; font-size: 10px; }
  .care-nav a > svg { width: 20px; height: 20px; }
  .role-preview div { grid-template-columns: repeat(2, 1fr); }
  .simple-form.two-columns { grid-template-columns: 1fr; }
  .simple-form .full-row { grid-column: auto; }
  .admin-grid { grid-template-columns: 1fr; }
  .portal-header { align-items: flex-start; }
  .portal-header .brand-logo { width: 72px; height: 72px; flex-basis: 72px; }
  .portal-header h1 { font-size: 27px; }
}

@media (min-width: 481px) and (max-width: 760px) {
  .care-nav { grid-template-columns: repeat(3, 1fr); }
}

