/* =====================================================================
   Speaker Scheduler — stylesheet
   PHP 5.4 / CentOS server, no build tools — plain CSS only
===================================================================== */

/* ----- Reset & base ------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 16px; }
body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    background: #f0f4f8;
    color: #1a202c;
    line-height: 1.6;
    margin: 0;
    min-height: 100vh;
}
a { color: #2b6cb0; text-decoration: none; }
a:hover { text-decoration: underline; }
p { margin: 0 0 .75rem; }

/* ----- Navigation -------------------------------------------------- */
.nav {
    background: #1a365d;
    position: sticky;
    top: 0;
    z-index: 200;
    box-shadow: 0 2px 6px rgba(0,0,0,.25);
}
.nav-inner {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 54px;
}
.nav-brand {
    color: #fff;
    font-weight: 700;
    font-size: 1.05rem;
    letter-spacing: -.01em;
    text-decoration: none;
}
.nav-links a {
    color: rgba(255,255,255,.8);
    margin-left: 22px;
    font-size: .9rem;
    text-decoration: none;
    transition: color .15s;
}
.nav-links a:hover { color: #fff; }

/* ----- Container --------------------------------------------------- */
.container {
    max-width: 960px;
    margin: 0 auto;
    padding: 32px 20px 48px;
}

/* ----- Page heading ------------------------------------------------ */
.page-heading {
    margin-bottom: 28px;
}
.page-heading h1 {
    font-size: 1.75rem;
    font-weight: 700;
    color: #1a202c;
    margin: 0 0 4px;
    line-height: 1.2;
}
.page-heading .subtitle {
    color: #718096;
    font-size: .95rem;
    margin: 0;
}

/* ----- Card -------------------------------------------------------- */
.card {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.05);
    padding: 24px;
    margin-bottom: 24px;
}
.card-title {
    font-size: 1rem;
    font-weight: 700;
    color: #2d3748;
    margin: 0 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e2e8f0;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-size: .8rem;
}

/* ----- Two-column grid --------------------------------------------- */
.grid-2 {
    display: flex;
    gap: 24px;
}
.grid-2 > * { flex: 1; }

/* ----- Forms ------------------------------------------------------- */
.form-group { margin-bottom: 18px; }
.form-group label {
    display: block;
    font-size: .875rem;
    font-weight: 600;
    color: #4a5568;
    margin-bottom: 5px;
}
.form-group .hint {
    font-size: .8rem;
    color: #a0aec0;
    margin-top: 3px;
}
input[type="text"],
input[type="date"],
input[type="time"],
input[type="datetime-local"],
select,
textarea {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid #cbd5e0;
    border-radius: 6px;
    font-size: .95rem;
    color: #2d3748;
    background: #fff;
    font-family: inherit;
    transition: border-color .15s, box-shadow .15s;
    -webkit-appearance: none;
}
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: #4299e1;
    box-shadow: 0 0 0 3px rgba(66,153,225,.2);
}
select { cursor: pointer; }

/* ----- Buttons ----------------------------------------------------- */
.btn {
    display: inline-block;
    padding: 9px 22px;
    border-radius: 6px;
    font-size: .9rem;
    font-weight: 600;
    cursor: pointer;
    border: none;
    text-decoration: none;
    font-family: inherit;
    transition: background .15s, box-shadow .15s, transform .08s;
    line-height: 1.4;
}
.btn:active { transform: scale(.97); }
.btn + .btn { margin-left: 8px; }

.btn-primary  { background: #2b6cb0; color: #fff; }
.btn-primary:hover  { background: #2c5282; }

.btn-success  { background: #276749; color: #fff; }
.btn-success:hover  { background: #22543d; }

.btn-warning  { background: #b7791f; color: #fff; }
.btn-warning:hover  { background: #975a16; }

.btn-danger   { background: #c53030; color: #fff; }
.btn-danger:hover   { background: #9b2c2c; }

.btn-secondary { background: #e2e8f0; color: #4a5568; }
.btn-secondary:hover { background: #cbd5e0; }

.btn-outline {
    background: transparent;
    border: 1.5px solid #cbd5e0;
    color: #4a5568;
}
.btn-outline:hover { background: #f7fafc; border-color: #a0aec0; }

.btn-sm { padding: 5px 13px; font-size: .8rem; }
.btn-xs { padding: 3px 9px;  font-size: .75rem; }

/* ----- Alerts ------------------------------------------------------ */
.alert {
    padding: 12px 16px;
    border-radius: 7px;
    margin-bottom: 20px;
    font-size: .9rem;
    border-width: 1px;
    border-style: solid;
}
.alert-success { background: #f0fff4; border-color: #9ae6b4; color: #276749; }
.alert-error   { background: #fff5f5; border-color: #feb2b2; color: #9b2c2c; }
.alert-info    { background: #ebf8ff; border-color: #90cdf4; color: #2a69ac; }
.alert-warning { background: #fffaf0; border-color: #fbd38d; color: #975a16; }

/* ----- Badges ------------------------------------------------------ */
.badge {
    display: inline-block;
    padding: 2px 9px;
    border-radius: 999px;
    font-size: .73rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}
.badge-green { background: #c6f6d5; color: #276749; }
.badge-amber { background: #fefcbf; color: #975a16; }
.badge-blue  { background: #bee3f8; color: #2a69ac; }
.badge-gray  { background: #e2e8f0; color: #4a5568; }
.badge-red   { background: #fed7d7; color: #9b2c2c; }

/* ----- Tables ------------------------------------------------------ */
.table {
    width: 100%;
    border-collapse: collapse;
    font-size: .9rem;
}
.table th {
    background: #f7fafc;
    color: #4a5568;
    font-weight: 700;
    text-align: left;
    padding: 9px 14px;
    border-bottom: 2px solid #e2e8f0;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    white-space: nowrap;
}
.table td {
    padding: 11px 14px;
    border-bottom: 1px solid #f0f4f8;
    vertical-align: middle;
}
.table tr:last-child td { border-bottom: none; }
.table tbody tr:hover td { background: #f7fafc; }

/* Slot type row tints */
.row-breakfast  td { background: #fffff0; }
.row-lunch      td { background: #f0fff4; }
.row-seminar    td { background: #fff5f5; }
.row-happyhour  td { background: #fffaf0; }
.row-dinner     td { background: #faf5ff; }
.row-prep       td { background: #f7fafc; color: #718096; font-style: italic; }

.row-breakfast:hover  td { background: #fefce8 !important; }
.row-lunch:hover      td { background: #dcfce7 !important; }
.row-seminar:hover    td { background: #fee2e2 !important; }
.row-happyhour:hover  td { background: #fed7aa55 !important; }
.row-dinner:hover     td { background: #e9d8fd55 !important; }
.row-prep:hover       td { background: #e2e8f0 !important; }

/* ----- Flex utilities ---------------------------------------------- */
.flex            { display: flex; }
.items-center    { align-items: center; }
.justify-between { justify-content: space-between; }
.gap-2           { gap: 8px; }
.gap-3           { gap: 12px; }
.flex-wrap       { flex-wrap: wrap; }

/* ----- Text utilities ---------------------------------------------- */
.text-muted  { color: #718096; }
.text-sm     { font-size: .875rem; }
.text-xs     { font-size: .78rem; }
.font-bold   { font-weight: 700; }
.mt-1 { margin-top: 4px; }
.mt-2 { margin-top: 8px; }
.mt-3 { margin-top: 12px; }
.mt-4 { margin-top: 16px; }
.mt-6 { margin-top: 24px; }
.mb-1 { margin-bottom: 4px; }
.mb-2 { margin-bottom: 8px; }
.mb-4 { margin-bottom: 16px; }

/* ----- Index page -------------------------------------------------- */
.index-grid { display: flex; gap: 24px; margin-bottom: 28px; }
.index-grid > * { flex: 1; }
.index-panel {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0,0,0,.08);
    padding: 22px 24px;
}
.index-panel.panel-public  { border-top: 4px solid #276749; }
.index-panel.panel-admin   { border-top: 4px solid #2b6cb0; }
.index-panel h2 {
    font-size: .9rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    margin: 0 0 16px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e2e8f0;
}
.panel-public h2 { color: #276749; }
.panel-admin  h2 { color: #2b6cb0; }
.panel-note {
    font-size: .8rem;
    color: #718096;
    margin-top: 14px;
    font-style: italic;
}
.nav-list { list-style: none; padding: 0; margin: 0; }
.nav-list li + li { margin-top: 10px; }
.nav-list a {
    display: block;
    padding: 9px 14px;
    border-radius: 6px;
    font-size: .9rem;
    font-weight: 500;
    text-decoration: none;
    transition: background .12s;
}
.panel-public .nav-list a { color: #276749; background: #f0fff4; }
.panel-public .nav-list a:hover { background: #c6f6d5; }
.panel-admin  .nav-list a { color: #2b6cb0; background: #ebf8ff; }
.panel-admin  .nav-list a:hover { background: #bee3f8; }
.nav-list .link-desc {
    display: block;
    font-size: .78rem;
    font-weight: 400;
    color: #718096;
    margin-top: 1px;
}

/* ----- Seminar list (index) ---------------------------------------- */
.seminar-list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 13px 16px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    margin-bottom: 10px;
    background: #fff;
    flex-wrap: wrap;
    gap: 8px;
}
.seminar-list-name  { font-weight: 700; color: #2d3748; }
.seminar-list-date  { color: #718096; font-size: .875rem; }
.seminar-list-links { display: flex; gap: 8px; flex-wrap: wrap; }

/* ----- Signup page ------------------------------------------------- */
.slot-btn {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    border: 2px solid #e2e8f0;
    border-radius: 8px;
    cursor: pointer;
    user-select: none;
    background: #fff;
    margin-bottom: 7px;
    transition: border-color .12s, background .12s;
    gap: 12px;
}
.slot-btn:hover { border-color: #cbd5e0; background: #f7fafc; }
.slot-btn.state-avail    { border-color: #48bb78; background: #f0fff4; }
.slot-btn.state-preferred { border-color: #ed8936; background: #fffaf0; }
.slot-time {
    font-weight: 700;
    color: #2d3748;
    white-space: nowrap;
    min-width: 165px;
    font-size: .9rem;
}
.slot-label {
    flex: 1;
    color: #4a5568;
    font-size: .9rem;
}
.slot-status-txt {
    min-width: 90px;
    text-align: right;
    font-size: .78rem;
    font-weight: 700;
    color: #a0aec0;
}
.state-avail    .slot-status-txt { color: #276749; }
.state-preferred .slot-status-txt { color: #c05621; }

.signup-legend {
    display: flex;
    gap: 20px;
    margin-bottom: 18px;
    font-size: .82rem;
    color: #4a5568;
    flex-wrap: wrap;
}
.legend-item { display: flex; align-items: center; gap: 6px; }
.legend-swatch {
    width: 18px; height: 18px; border-radius: 4px; border: 2px solid;
    display: inline-block;
}
.swatch-none      { background: #fff;    border-color: #cbd5e0; }
.swatch-avail     { background: #f0fff4; border-color: #48bb78; }
.swatch-preferred { background: #fffaf0; border-color: #ed8936; }

.group-slot-note { font-style: italic; font-size: .8rem; color: #718096; }

/* ----- Assign page ------------------------------------------------- */
.assign-slot-row {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 14px 16px;
    margin-bottom: 10px;
    display: flex;
    gap: 16px;
    align-items: flex-start;
    background: #fff;
}
.assign-slot-info { min-width: 180px; }
.assign-time  { font-weight: 700; font-size: .9rem; color: #2d3748; }
.assign-label { font-size: .82rem; color: #718096; margin-top: 2px; }
.assign-current {
    min-width: 160px;
    font-size: .85rem;
    color: #2d3748;
}
.assign-current-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: #a0aec0; margin-bottom: 4px; }
.assign-people { flex: 1; display: flex; flex-wrap: wrap; gap: 6px; align-items: flex-start; }
.assign-people-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: #a0aec0; margin-bottom: 6px; width: 100%; }

.chip {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 4px 11px;
    border-radius: 999px;
    font-size: .8rem;
    cursor: pointer;
    border: 1.5px solid transparent;
    transition: all .12s;
    font-weight: 500;
}
.chip-avail     { background: #ebf8ff; color: #2b6cb0; border-color: #90cdf4; }
.chip-preferred { background: #fffaf0; color: #c05621; border-color: #fbd38d; font-weight: 700; }
.chip-selected  { background: #2b6cb0; color: #fff; border-color: #2b6cb0; }
.chip-preferred.chip-selected { background: #c05621; border-color: #c05621; }
.chip:hover { opacity: .82; }
.chip .chip-x { font-size: .9rem; line-height: 1; opacity: .7; cursor: pointer; }
.chip .chip-x:hover { opacity: 1; }

.assign-columns { display: flex; gap: 20px; margin-top: 28px; }
.assign-col {
    flex: 1;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 16px;
    background: #fff;
    min-height: 80px;
}
.assign-col-title {
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e2e8f0;
}
.col-unassigned .assign-col-title { color: #c53030; }
.col-assigned   .assign-col-title { color: #276749; }
.col-person-item { padding: 4px 6px; font-size: .85rem; color: #4a5568; }

/* ----- Schedule (public view) -------------------------------------- */
.schedule-page { max-width: 760px; margin: 0 auto; }
.schedule-masthead {
    text-align: center;
    padding: 36px 24px 28px;
    border-bottom: 2px solid #2d3748;
    margin-bottom: 32px;
}
.schedule-speaker-name {
    font-size: 1.6rem;
    font-weight: 800;
    color: #1a202c;
    margin: 0 0 6px;
}
.schedule-talk-title {
    font-size: 1.1rem;
    color: #4a5568;
    font-style: italic;
    margin: 0 0 14px;
}
.schedule-meta {
    color: #2b6cb0;
    font-weight: 600;
    font-size: .95rem;
}
.schedule-table {
    width: 100%;
    border-collapse: collapse;
}
.schedule-table thead tr {
    background: #2d3748;
    color: #fff;
}
.schedule-table th {
    padding: 11px 16px;
    text-align: left;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .07em;
    font-weight: 700;
    border: none;
}
.schedule-table td {
    padding: 12px 16px;
    border-bottom: 1px solid #e2e8f0;
    vertical-align: middle;
    font-size: .92rem;
}
.schedule-table tr:last-child td { border-bottom: none; }
.sched-time   { white-space: nowrap; color: #718096; font-size: .85rem; width: 145px; }
.sched-event  { font-weight: 600; color: #2d3748; }
.sched-person { color: #2d3748; }
.sched-office { color: #718096; font-size: .85rem; }
.sched-row-group td { background: #f7fafc; font-style: normal; }
.sched-row-breakfast td { background: #fffff0; }
.sched-row-lunch     td { background: #f0fff4; }
.sched-row-seminar   td { background: #fff5f5; font-weight: bold; }
.sched-row-happyhour td { background: #fffaf0; }
.sched-row-dinner    td { background: #faf5ff; }
.sched-row-prep      td { background: #f7fafc; color: #718096; font-style: italic; }

.schedule-print-note {
    text-align: center;
    margin-top: 32px;
    font-size: .8rem;
    color: #a0aec0;
}

/* ----- Modify final page ------------------------------------------- */
.mf-row {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    margin-bottom: 8px;
    background: #fff;
    overflow: hidden;
}
.mf-row-display {
    display: flex;
    align-items: center;
    padding: 12px 14px;
    gap: 14px;
}
.mf-row-edit {
    display: none;
    padding: 14px 16px;
    border-top: 1px solid #e2e8f0;
    background: #f7fafc;
    gap: 12px;
    flex-wrap: wrap;
    align-items: flex-end;
}
.mf-row-edit.open { display: flex; }
.mf-time-disp  { font-weight: 700; font-size: .9rem; min-width: 155px; color: #2d3748; }
.mf-label-disp { flex: 1; color: #4a5568; font-size: .9rem; }
.mf-person-disp { color: #2d3748; font-size: .9rem; min-width: 180px; }
.mf-actions { display: flex; gap: 6px; }
.mf-edit-group { display: flex; flex-direction: column; }
.mf-edit-group label { font-size: .75rem; font-weight: 700; color: #718096; margin-bottom: 3px; text-transform: uppercase; letter-spacing: .04em; }
.mf-edit-group input, .mf-edit-group select { width: auto; min-width: 120px; font-size: .85rem; }
.mf-person-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.mf-person-tag {
    display: inline-flex; align-items: center; gap: 4px;
    background: #ebf8ff; color: #2b6cb0; border: 1px solid #90cdf4;
    border-radius: 999px; padding: 2px 10px; font-size: .8rem;
    cursor: default;
}
.mf-person-tag .rm { cursor: pointer; opacity: .6; font-size: .9rem; }
.mf-person-tag .rm:hover { opacity: 1; color: #c53030; }

/* ----- Calendar page ----------------------------------------------- */
.cal-filter { display: flex; gap: 14px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 24px; }
.cal-filter .form-group { margin-bottom: 0; }
.cal-entry {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    margin-bottom: 10px;
    flex-wrap: wrap;
    gap: 10px;
}
.cal-entry-info { flex: 1; min-width: 200px; }
.cal-entry-date { font-size: .85rem; color: #718096; }
.cal-entry-name { font-weight: 700; font-size: 1.05rem; color: #2d3748; margin: 2px 0; }
.cal-entry-title { font-size: .875rem; color: #4a5568; font-style: italic; }
.cal-entry-host  { font-size: .78rem;  color: #718096; margin-top: 2px; }
.cal-empty { text-align: center; padding: 40px; color: #a0aec0; }

/* ----- Footer ------------------------------------------------------ */
.site-footer {
    text-align: center;
    padding: 16px;
    font-size: .82rem;
    color: #a0aec0;
    border-top: 1px solid #e2e8f0;
    margin-top: 8px;
}

/* ----- Print ------------------------------------------------------- */
@media print {
    .nav, .site-footer, .btn, .no-print { display: none !important; }
    body { background: #fff; }
    .container { padding: 0; max-width: 100%; }
    .schedule-masthead { border-color: #000; }
    .schedule-table th { background: #2d3748 !important; -webkit-print-color-adjust: exact; }
}

/* ----- Responsive -------------------------------------------------- */
@media (max-width: 680px) {
    .index-grid  { flex-direction: column; }
    .grid-2      { flex-direction: column; }
    .assign-slot-row  { flex-direction: column; }
    .assign-columns   { flex-direction: column; }
    .slot-time   { min-width: 0; }
    .slot-btn    { flex-wrap: wrap; }
    .nav-inner   { padding: 0 14px; }
    .container   { padding: 20px 14px 40px; }
}
