.c-icon { width: var(--icon-size); height: var(--icon-size); flex-shrink: 0; vertical-align: middle; }
.c-button { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: var(--control-height); padding: var(--space-2) var(--space-3); font: inherit; font-weight: var(--font-weight-medium); cursor: pointer; text-decoration: none; color: var(--color-on-primary); background: var(--color-primary); border: 1px solid transparent; border-radius: var(--radius-control); transition: background var(--transition-hover), box-shadow var(--transition-hover), transform var(--transition-hover); }
.c-button:hover { background: var(--color-primary-hover); color: var(--color-on-primary); }
.c-button:active { background: var(--color-primary-active); transform: translateY(1px); }
.c-button--secondary { color: var(--color-text); background: var(--color-surface); border-color: var(--color-border); }
.c-button--ghost { color: var(--color-text-secondary); background: transparent; }
.c-button--secondary:hover, .c-button--ghost:hover { background: var(--color-surface-hover); color: var(--color-text); }
.c-button--secondary:active, .c-button--ghost:active { background: var(--color-surface-active); color: var(--color-primary-text); }
.c-button--danger { background: var(--color-danger); color: var(--color-on-primary); }
.c-button--danger:hover, .c-button--danger:active { background: var(--color-critical); }
.c-button--icon { width: var(--control-height); padding: var(--space-2); flex-shrink: 0; }
.c-button:disabled, .c-button[aria-disabled="true"], input:disabled, select:disabled { opacity: var(--disabled-opacity); cursor: not-allowed; transform: none; }
.c-button[aria-busy="true"]::before { content: ''; width: 1rem; height: 1rem; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: busy-spin .7s linear infinite; }
@keyframes busy-spin { to { transform: rotate(360deg); } }
.c-field { min-width: 0; margin-block: var(--space-3); }
.c-field label { display: block; font-weight: var(--font-weight-medium); margin-bottom: var(--space-2); font-size: var(--font-size-small); }
.c-field input:not([type="checkbox"]):not([type="radio"]), .c-field select, .c-field textarea { width: 100%; min-height: var(--control-height); padding: var(--space-2) var(--space-3); font: inherit; border: 1px solid var(--color-border-strong); border-radius: var(--radius-control); background: var(--color-surface); color: var(--color-text); transition: border-color var(--transition-hover), box-shadow var(--transition-hover); }
.c-field input:hover, .c-field select:hover, .c-field textarea:hover { border-color: var(--color-primary); }
.c-field input:focus, .c-field select:focus, .c-field textarea:focus { border-color: var(--color-primary); }
.c-field textarea { max-width: 100%; resize: vertical; }
.c-field input[type="checkbox"], .c-field input[type="radio"], input[name="confirm"] { width: 1.25rem; height: 1.25rem; accent-color: var(--color-primary); vertical-align: middle; }
.c-field--checkbox { display: flex; gap: var(--space-2); align-items: start; flex-wrap: wrap; padding-block: var(--space-2); }
.c-field--checkbox label { flex: 1; margin: 0; }
.c-field [aria-invalid="true"] { border-color: var(--color-danger); background: var(--color-error-surface); }
.c-field-error { color: var(--color-danger); margin-block: var(--space-2); font-size: var(--font-size-small); }
.c-field-error p { margin: 0; }
.c-help { margin-top: var(--space-2); overflow-wrap: anywhere; }
.c-required { color: var(--color-danger); }
.c-password-control { display: flex; align-items: center; gap: var(--space-2); }
.c-password-control input { min-width: 0; }
.c-password-control button { display: none; }
[data-ui-ready] .c-password-control button { display: inline-flex; }
.c-form-section { border: 0; padding: 0; margin: 0 0 var(--space-4); }
.c-form-grid { display: grid; gap: 0 var(--space-3); }
.c-field--short { max-width: 15rem; }
.c-feedback { display: flex; align-items: start; gap: var(--space-2); padding: var(--space-3); border-radius: var(--radius-control); background: var(--color-info-surface); color: var(--color-info); margin-bottom: var(--space-3); }
.c-feedback--error { color: var(--color-danger); background: var(--color-error-surface); }
.c-feedback--success { color: var(--color-success); background: var(--color-success-surface); }
.c-feedback--warning { color: var(--color-warning); background: var(--color-warning-surface); }
.c-feedback p { margin: 0; } .c-feedback > div { flex: 1; }
.c-status-chip { display: inline-flex; align-items: center; gap: var(--space-1); font-size: var(--font-size-meta); font-weight: var(--font-weight-medium); padding: var(--space-1) var(--space-2); border-radius: var(--radius-card); background: var(--color-surface-secondary); color: var(--color-text-secondary); }
.c-status-chip--success { background: var(--color-success-surface); color: var(--color-success); }
.c-status-chip--warning { background: var(--color-warning-surface); color: var(--color-warning); }
.c-status-chip--danger { background: var(--color-error-surface); color: var(--color-danger); }
.c-empty-state { padding: var(--space-5); text-align: center; color: var(--color-text-secondary); }
.c-empty-state > .c-icon { width: 2rem; height: 2rem; color: var(--color-primary-text); }
.c-dialog { width: min(30rem, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); overflow: auto; border: 1px solid var(--color-border); border-radius: var(--radius-card); padding: var(--space-4); box-shadow: var(--shadow-popover); color: var(--color-text); }
.c-dialog::backdrop { background: var(--color-overlay); }
.c-dialog-header { display: flex; justify-content: space-between; gap: var(--space-3); align-items: center; }
.c-dialog-header h2 { margin: 0; }
.c-member-list { list-style: none; padding: 0; }
.c-member-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-3); align-items: center; padding: var(--space-3) 0; border-bottom: 1px solid var(--color-border); }
.c-member-row:hover { background: var(--color-surface-hover); }
.c-member-row p { margin: var(--space-1) 0; }
.c-member-row > a { grid-column: 2; grid-row: 1; }
.c-member-meta { grid-column: 1; display: flex; flex-wrap: wrap; gap: var(--space-2); }
.c-list-header { display: none; }
.c-popover { position: absolute; padding: var(--space-2); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-card); box-shadow: var(--shadow-popover); z-index: var(--z-navigation); max-height: 65dvh; overflow-y: auto; }
.c-popover a { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-2); min-height: var(--control-height); border-radius: var(--radius-control); text-decoration: none; }
.c-popover a:hover { background: var(--color-surface-hover); }
[data-dropdown] > summary { list-style: none; cursor: pointer; }
[data-dropdown] > summary::-webkit-details-marker { display: none; }
.c-chevron { transition: transform var(--transition-hover); }
[open] > summary .c-chevron { transform: rotate(180deg); }
@media (min-width: 48rem) { .c-form-grid--two { grid-template-columns: repeat(2,minmax(0,1fr)); } .c-form-grid--two .c-field--wide { grid-column: 1 / -1; } .c-member-row { grid-template-columns: minmax(0,2fr) minmax(0,1fr) auto; } .c-member-row > a { grid-column: 3; } .c-member-meta { grid-column: 2; grid-row: 1; } .c-list-header { display: grid; color: var(--color-text-muted); font-size: var(--font-size-small); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* Shared navigation disclosure: native keyboard behavior, compact child rail. */
.c-navigation-group>summary{display:flex;align-items:center;gap:var(--space-3);min-height:var(--control-height);padding:var(--space-3);cursor:pointer;list-style:none;border-radius:var(--radius-control);color:var(--color-text-secondary)}
.c-navigation-group>summary::-webkit-details-marker{display:none}
.c-navigation-group>summary:hover{background:var(--color-surface-hover);color:var(--color-text)}
.c-navigation-group[open]>summary{color:var(--color-text);font-weight:var(--font-weight-medium)}
.c-navigation-chevron{margin-left:auto;display:flex;transition:transform var(--transition-hover)}
.c-navigation-group[open] .c-navigation-chevron{transform:rotate(180deg)}
.c-navigation-group>.c-navigation--children{margin:var(--space-1) 0 var(--space-3) var(--space-4);padding-left:var(--space-2);border-left:1px solid var(--color-border)}
.c-navigation-group .c-navigation--children a{min-height:var(--control-height);padding:var(--space-2) var(--space-3);font-size:var(--font-size-small)}
@media(prefers-reduced-motion:reduce){.c-navigation-chevron{transition:none}}

/* Shared native datetime widget: one date/time pair, including compact mobile forms. */
.c-field:has(>input[type="date"]):has(>input[type="time"]) {display:grid;grid-template-columns:minmax(0,11rem) minmax(0,6rem);gap:var(--space-2);justify-content:start;}
.c-field:has(>input[type="date"]):has(>input[type="time"]) > :is(label,.c-help,.c-field-error) {grid-column:1/-1;}
.c-field:has(>input[type="date"]) > input[type="time"] {margin:0;min-width:0;}
.c-field:has(>input[type="date"]) > input:is([type="date"],[type="time"]) {padding-inline:var(--space-2);}
@media(max-width:350px){.c-field:has(>input[type="date"]):has(>input[type="time"]) {grid-template-columns:minmax(0,1fr);}}

/* Disabled actions stay neutral and readable, independent of the brand color. */
.c-button:disabled, .c-button[aria-disabled="true"] { background:var(--color-surface-secondary); color:var(--color-text-secondary); border-color:var(--color-border); opacity:1; box-shadow:none; }

/* Native content disclosures share the same control treatment throughout the app.
   Menus and navigation retain their dedicated components. */
details:not([data-dropdown]):not(.c-navigation-group) > summary:not(.c-button) { display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); min-height:var(--control-height); padding:var(--space-2) var(--space-3); margin-block:var(--space-2); border:1px solid var(--color-border); border-radius:var(--radius-control); background:var(--color-surface-secondary); color:var(--color-text); font-weight:var(--font-weight-medium); cursor:pointer; list-style:none; }
details:not([data-dropdown]):not(.c-navigation-group) > summary:not(.c-button)::-webkit-details-marker { display:none; }
details:not([data-dropdown]):not(.c-navigation-group) > summary:not(.c-button)::after { content:''; width:.5rem; height:.5rem; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(45deg); flex:none; margin-inline:var(--space-2); }
details[open]:not([data-dropdown]):not(.c-navigation-group) > summary:not(.c-button)::after { transform:rotate(225deg); }
details:not([data-dropdown]):not(.c-navigation-group) > summary:not(.c-button):hover { background:var(--color-surface-hover); border-color:var(--color-border-strong); }

/* Shared search picker, used by planning and ownership. */
.choice-dialog{width:min(34rem,calc(100vw - 2rem));max-height:85dvh;padding:var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-card);box-shadow:var(--shadow-popover);color:var(--color-text)}
.choice-dialog::backdrop{background:var(--color-overlay)}
.choice-results{max-height:48dvh;overflow-y:auto;margin-block:var(--space-3)}
.choice-result{display:flex!important;align-items:center;gap:var(--space-3);padding:var(--space-3);border-bottom:1px solid var(--color-border);min-height:var(--control-height);cursor:pointer}
.choice-result input{width:1.2rem!important;height:1.2rem;flex:0 0 auto}.choice-result:has(input:checked){background:var(--color-surface-active)}
.choice-result:has(input:disabled){opacity:var(--disabled-opacity)}
.choice-chips{display:flex;gap:var(--space-1);flex-wrap:wrap;min-width:0}.choice-chips button{white-space:normal;text-align:left;overflow-wrap:anywhere;background:var(--color-surface-secondary);font-size:var(--font-size-small)}
.choice-trigger{justify-content:flex-start;max-width:100%;white-space:normal;text-align:left}
.choice-dialog:not([popover]):not([open]){display:none}
.choice-dialog[popover] {position:fixed;inset:auto;margin:0;max-width:calc(100vw - 24px);max-height:calc(100dvh - 32px);overflow:auto;box-sizing:border-box;box-shadow:var(--shadow-popover);border:1px solid var(--color-border);border-radius:var(--radius-card);background:var(--color-surface);color:var(--color-text);padding:var(--space-3);}
.choice-dialog[popover] h2 {font-size:var(--font-size-body);margin-top:0;}
.choice-dialog[popover] .choice-results {max-height:35dvh;}
.choice-dialog[popover] .c-form-actions {position:sticky;bottom:0;background:var(--color-surface);padding-block:var(--space-2);}
.choice-dialog[popover]:popover-open {display:block;}
.choice-dialog[popover]::backdrop {background:transparent;}
@media(max-width:47.99rem){.choice-dialog{margin:auto 0 0;width:100%;max-width:none;border-radius:var(--radius-card) var(--radius-card) 0 0;padding:var(--space-3)}.choice-chips{max-width:100%}}

.c-segmented { display:inline-flex; flex-wrap:wrap; gap:var(--space-1); padding:var(--space-1); background:var(--color-surface-secondary); border-radius:var(--radius-control); margin-block:var(--space-2); }
.c-segmented .c-button { min-height:2.5rem; border:0; }
.c-segmented .c-button:not([aria-current]) { background:transparent; box-shadow:none; color:var(--color-text-secondary); }
.c-segmented .c-button:not([aria-current]):hover { background:var(--color-surface-hover); color:var(--color-text); }
.c-segmented [aria-current] { background:var(--color-surface); color:var(--color-primary-text); font-weight:600; box-shadow:0 1px 3px color-mix(in srgb,var(--color-text) 10%,transparent); }
@media(max-width:47.99rem){.c-segmented .c-button { min-height:var(--control-height); }}

/* Native controls outside FormField receive the same baseline; feature styles win. */
:where(main form) :where(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="submit"]),select,textarea){min-height:var(--control-height);max-width:100%;min-width:0;padding:var(--space-2) var(--space-3);font:inherit;border:1px solid var(--color-border-strong);border-radius:var(--radius-control);background:var(--color-surface);color:var(--color-text)}
:where(main form) :where(input[type="checkbox"],input[type="radio"]){accent-color:var(--color-primary)}

.horse-restriction-notice{padding:var(--space-3);margin-block:var(--space-3)}.horse-restriction-notice ul{margin-block:var(--space-1);padding-inline-start:var(--space-3)}.horse-restriction-link{display:inline-flex;align-items:center;min-height:var(--control-height);font-size:var(--font-size-small);font-weight:var(--font-weight-medium)}

.c-form-section-nav{display:flex;flex-wrap:wrap;gap:var(--space-2);padding-bottom:var(--space-3);border-bottom:1px solid var(--color-border);margin-bottom:var(--space-4)}
.c-form-section-nav .c-button{flex:1;background:var(--color-surface);color:var(--color-text-secondary)}.c-form-section-nav [aria-pressed=true]{background:var(--color-surface-active);color:var(--color-primary-text);border-color:var(--color-primary)}
[data-form-section]>h2{font-size:var(--font-size-subheading)}
.c-form-section-next{margin-top:var(--space-4)}

.choice-close{float:right}.choice-result small{display:block;color:var(--color-text-secondary);font-size:var(--font-size-small);margin-top:var(--space-1)}
.c-mobile-sheet{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);padding:var(--space-4);border-radius:var(--radius-card);max-height:90dvh;overflow:auto}.c-mobile-sheet::backdrop{background:var(--color-overlay)}
[data-mobile-sections]>.c-form-section-nav{display:none}
@media(max-width:48rem){
 .choice-dialog:not([popover]),.c-mobile-sheet{position:fixed;inset:auto 0 0;margin:0;width:100%;max-width:none;max-height:90dvh;border-radius:var(--radius-card) var(--radius-card) 0 0;padding:var(--space-4);padding-bottom:max(var(--space-4),env(safe-area-inset-bottom));box-sizing:border-box}
 .choice-dialog:not([popover]) .choice-results{max-height:50dvh;overflow:auto}.choice-dialog:not([popover]) .c-form-actions{position:sticky;bottom:0;background:var(--color-surface);padding-block:var(--space-2)}
 [data-mobile-sections]>.c-form-section-nav{display:flex;flex-wrap:nowrap;gap:var(--space-2);overflow:auto;padding-block:var(--space-2);margin-bottom:var(--space-3)}
 [data-mobile-sections]>.c-form-section-nav>button{flex:0 0 auto;width:auto}
 [data-mobile-sections]>.c-form-section-nav>[aria-pressed=true]{background:var(--color-primary);color:#fff}
 .planning-form>.c-form-actions,.horse-record-form>.c-form-actions,.horse-workspace .c-account form>.c-form-actions,.operations-form>.c-form-actions{position:sticky;bottom:calc(4.5rem + env(safe-area-inset-bottom));z-index:var(--z-sticky,10);background:var(--color-surface);border-top:1px solid var(--color-border);padding:var(--space-3);margin-inline:calc(-1 * var(--space-3));box-shadow:var(--shadow-card)}
 .planning-form,.horse-record-editor{scroll-margin-top:5rem}.c-mobile-sheet .planning-filter{display:grid;gap:var(--space-3)}
}
