@charset "utf-8";
/* Design Tokens */
@import url('/css/theme.css');

/* reserve.css (palette unified with theme.css) */
.reserve-chooser {margin-top:20px}

.reserve-chooser .reserve-grid {display:grid; grid-template-columns: repeat(3, 1fr); gap:24px}
@media (max-width:1024px){.reserve-chooser .reserve-grid {grid-template-columns: repeat(2, 1fr);} }
@media (max-width:640px){.reserve-chooser .reserve-grid {grid-template-columns: 1fr;} }

.reserve-chooser .reserve-card {position:relative; background:var(--color-surface,#fff); border:1px solid var(--color-border,#e6e8eb); border-radius:var(--radius-2xl,14px); padding:28px; box-shadow:var(--shadow-md,0 4px 14px rgba(0,0,0,.06)); transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease}
.reserve-chooser .reserve-card:focus-within, .reserve-chooser .reserve-card:hover {transform:translateY(-2px); box-shadow:var(--shadow-lg,0 10px 24px rgba(0,0,0,.10)); border-color:var(--color-border-strong,#cfd6e4)}

.reserve-chooser .reserve-card .icon {width:56px; height:56px; border-radius:14px; display:flex; align-items:center; justify-content:center; margin-bottom:14px; background:linear-gradient(135deg, var(--color-primary-soft-start,#e9f2ff), var(--color-primary-soft-end,#f3f7ff)); border:1px solid var(--color-primary-border-accent,#d7e4ff)}

.reserve-chooser .reserve-card h3 {font-size:20px; line-height:1.25; margin:4px 0 10px; color:var(--color-text-strong,#0d223d)}
.reserve-chooser .reserve-card p {color:var(--color-text-muted,#576071); line-height:1.6; margin:0 0 18px}

.reserve-chooser .reserve-actions {display:flex; gap:10px; flex-wrap:wrap}

.reserve-chooser .reserve-btn, .rbtn {display:inline-flex; align-items:center; gap:8px; border-radius:10px; text-decoration:none; font-weight:600; transition:background .2s ease, color .2s ease, box-shadow .2s ease, border-color .2s ease;}
.reserve-chooser .reserve-btn {padding:12px 16px;}
.rbtn {padding:10px 14px;}

.reserve-chooser .reserve-btn.primary, .rbtn.primary {color:#fff; background:var(--color-primary,#1a56db); box-shadow:0 6px 14px rgba(26,86,219,.20);}
.reserve-chooser .reserve-btn.primary:hover, .reserve-chooser .reserve-btn.primary:focus, .rbtn.primary:hover, .rbtn.primary:focus {background:var(--color-primary-hover,#174dc4);}

.reserve-chooser .reserve-btn.ghost, .rbtn.ghost {color:var(--color-primary,#1a56db); background:var(--color-surface-soft,#f5f8ff); border:1px solid var(--color-primary-border-accent,#d7e4ff);}
.reserve-chooser .reserve-btn.ghost:hover, .reserve-chooser .reserve-btn.ghost:focus, .rbtn.ghost:hover, .rbtn.ghost:focus {background:var(--color-surface-soft-hover,#eef4ff);}

.reserve-chooser .reserve-card .meta {display:flex; gap:10px; align-items:center; color:var(--color-text-sub,#6b7280); font-size:0.875rem; margin-top:4px;}
.reserve-chooser .reserve-note {margin-top:28px; padding:14px 16px; border-radius:10px; background:var(--color-surface-alt,#f8fafc); border:1px solid var(--color-border,#e6e8eb); color:var(--color-text-muted,#4b5563); font-size:0.9375rem;}
.rtit + .reserve-chooser {margin-top:16px}

/* 예약 조회/변경 UI */
.reserve-lookup {margin-top:16px}
.reserve-lookup .lookup-grid {display:grid; grid-template-columns: repeat(1, 1fr); gap:24px}
@media (max-width:900px){.reserve-lookup .lookup-grid {grid-template-columns: 1fr;} }
.reserve-lookup .lookup-card {background:var(--color-surface,#fff); border:1px solid var(--color-border,#e6e8eb); border-radius:14px; padding:24px; box-shadow:var(--shadow-md,0 4px 14px rgba(0,0,0,.06))}
.reserve-lookup .lookup-card h3 {font-size:18px; margin:0 0 6px; color:var(--color-text-strong,#0d223d)}
.reserve-lookup .lookup-card .desc {color:var(--color-text-muted,#576071); margin:0 0 16px}
.reserve-lookup .lookup-form {display:block}
.reserve-lookup .form-row {display:flex; gap:12px; flex-wrap:wrap}
.reserve-lookup .form-group {flex:1 1 180px; display:flex; flex-direction:column; gap:6px; margin-bottom:12px}
.reserve-lookup label {font-size:0.9375rem; color:var(--color-text,#374151)}
.reserve-lookup input[type="text"], .reserve-lookup input[type="tel"], .reserve-lookup input[type="date"], .reserve-lookup input[type="password"], .reserve-lookup select {height:42px; padding:0 12px; border:1px solid var(--color-border,#d1d5db); border-radius:10px; color:var(--color-text-strong,#111827); background:var(--color-surface,#fff); transition:border-color .15s ease, box-shadow .15s ease}
.reserve-lookup input[type="text"]:focus, .reserve-lookup input[type="tel"]:focus, .reserve-lookup input[type="date"]:focus, .reserve-lookup input[type="password"]:focus, .reserve-lookup select:focus {border-color:var(--color-primary,#1a56db); box-shadow:var(--focus-ring,0 0 0 3px rgba(26,86,219,.15)); outline:none}
.reserve-lookup input[type="password"] {letter-spacing:2px; font-family:inherit}
.reserve-lookup input[type="password"]::placeholder {letter-spacing:0;}
.reserve-lookup input::placeholder {color:var(--color-text-placeholder,#9ca3af)}
.reserve-lookup .form-actions {display:flex; gap:10px; margin-top:6px}
.rbtn.primary {color:#fff; background:var(--color-primary,#1a56db); box-shadow:0 6px 14px rgba(26, 86, 219, .18)}
.rbtn.primary:hover, .rbtn.primary:focus {background:var(--color-primary-hover,#174dc4)}
.rbtn.ghost {color:var(--color-primary,#1a56db); background:var(--color-surface-soft,#f5f8ff); border:1px solid var(--color-primary-border-accent,#d7e4ff)}
.rbtn.ghost:hover, .rbtn.ghost:focus {background:var(--color-surface-soft-hover,#eef4ff)}
.reserve-lookup .help-note {margin-top:18px; padding:12px 14px; border-radius:10px; background:var(--color-surface-alt,#f8fafc); border:1px solid var(--color-border,#e6e8eb); color:var(--color-text-muted,#4b5563); font-size:0.9375rem;}
.hc1-download-wrap {display:flex; justify-content:center; gap:18px; margin-bottom:18px;}
.hc1-download-btn {display:inline-block; padding:10px 22px; background:var(--color-primary,#1a56db); color:#fff; border-radius:8px; font-weight:600; font-size:15px; text-decoration:none; transition:background .2s;}
.hc1-download-btn:hover, .hc1-download-btn:focus {background:var(--color-primary-hover,#174dc4);}
.hc1-download-btn2 {background:#ffffff; color:var(--color-primary,#1a56db); border:1px solid var(--color-primary,#1a56db);}
.hc1-download-btn2:hover, .hc1-download-btn2:focus {background:var(--color-surface-muted,#f3f4f6); color:var(--color-primary,#1a56db);}
.hc1-download-btn3 {background:#0a6fad; color:#ffffff; border:1px solid #0a6fad;}
.hc1-download-btn3:hover, .hc1-download-btn3:focus {background:#074c73; color:#ffffff;}

/* 조회 결과 테이블 */
.lookup-results.styled {margin-top:40px}
.lookup-results-title {font-size:18px; margin:0 0 14px; color:var(--color-text-strong,#0d223d); font-weight:600}
.lookup-results .tbl-wrap {overflow-x:auto;}
.lookup-results-table {width:100%; border-collapse:separate; border-spacing:0; background:var(--color-surface,#fff); border:1px solid #e5e7eb; border-radius:14px; overflow:hidden;}
.lookup-results-table thead th {background:#f3f6fa; padding:10px 12px; text-align:center; font-weight:600; color:#1f2937; border-bottom:1px solid #e5e7eb; white-space:nowrap}
.lookup-results-table tbody td {padding:10px 12px; border-bottom:1px solid #edf0f3; border-right:1px solid #f1f3f6; vertical-align:middle; background:#fff}
.lookup-results-table tbody tr:last-child td {border-bottom:0}
.lookup-results-table tbody td:last-child, .lookup-results-table thead th:last-child {border-right:0}
.lookup-results-table tbody tr.result-row:hover td {background:#f9fbfd}
.status-badge {display:inline-flex; align-items:center; padding:4px 10px; border-radius:999px; font-size:0.875rem; font-weight:600; line-height:1; letter-spacing:.3px;}
.status-pending {background:var(--color-pending-bg,#fff7e6); color:var(--color-warning,#b45309); border:1px solid #f9e2b6}
.status-completed {background:var(--color-positive-bg,#e6f8ef); color:#046c4e; border:1px solid #b4ebce}
.status-cancelled {background:var(--color-cancel-bg,#fdecef); color:var(--color-cancel,#b42318); border:1px solid #f9c9d0}
.rbtn.mini {padding:6px 12px; font-size:0.875rem; border-radius:8px; font-weight:600}
.rbtn.mini.detail-toggle {background:#f3f6fb; color:#1e3a8a; border:1px solid #d5deeb; box-shadow:none}
.rbtn.mini.detail-toggle:hover, .rbtn.mini.detail-toggle:focus {background:#e6eef7}
.detail-row td {background:#f9fafb}
.res-detail-box {border:1px solid #e5e7eb; background:#ffffff; border-radius:12px; padding:18px 20px; box-shadow:0 4px 10px rgba(0,0,0,.04);}
.detail-grid {display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:18px;}
.detail-section {background:#fbfcfd; border:1px solid var(--color-border-soft,#eef1f5); border-radius:10px; padding:14px 16px; position:relative;}
.detail-section h4 {margin:0 0 10px; font-weight:700; color:#111827; letter-spacing:.2px}
.detail-section ul {list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px}
.detail-section li {display:flex; align-items:center; gap:10px; font-size:0.9375rem; line-height:1.4; color:var(--color-text,#374151)}
.detail-section li span {flex:0 0 88px; color:var(--color-text-sub,#6b7280); font-weight:500}
.detail-section li strong {font-weight:600; color:#1f2937}
.detail-section li.additional {align-items:flex-start}
.detail-section li.additional span {margin-top:3px}
.detail-section li .multi {display:flex; flex-direction:column; gap:4px}
.detail-section li .multi em {font-style:normal; background:#f3f6fa; border:1px solid #e3e9f0; padding:4px 8px; border-radius:6px; font-size:0.875rem; color:#1f2d3d; display:inline-block}
.detail-section.basic::before, .detail-section.personal::before, .detail-section.disabilities::before, .detail-section.student::before, .detail-section.meta::before {content:""; position:absolute; top:0; left:0; height:100%; width:4px; border-radius:10px 0 0 10px; background:linear-gradient(var(--color-border-soft,#d1d5db), var(--color-border-soft,#d1d5db))}
.detail-section.personal::before {background:linear-gradient(var(--color-primary,#1a56db), var(--color-primary-hover,#174dc4))}
.detail-section.disabilities::before {background:linear-gradient(#10b981,#059669)}
.detail-section.student::before {background:linear-gradient(#8b5cf6,#7c3aed)}
.detail-section.meta::before {background:linear-gradient(#6b7280,#4b5563)}
@media (max-width:720px){
    .lookup-results-table thead {display:none}
    .lookup-results-table tbody tr.result-row, .lookup-results-table tbody tr.detail-row {display:block; border-bottom:1px solid #e5e7eb}
    .lookup-results-table tbody td {display:flex; justify-content:space-between; border-right:0; padding:8px 10px; font-size:0.9375rem;}
    .lookup-results-table tbody td[data-label]::before {content:attr(data-label); font-weight:600; color:var(--color-text-muted,#4b5563); padding-right:12px}
    .detail-row td {padding:0 0 12px}
    .res-detail-box {box-shadow:none; border:0; padding:12px 0 4px; background:transparent}
    .detail-grid {grid-template-columns:1fr}
}

/* === Enhancements for s0301f.php lookup results === */
/* 1. Center align result-row cells (desktop) */
.lookup-results-table tbody tr.result-row td {text-align:center;}
/* 2. Flexible column sizing & wrapping */
.lookup-results-table {table-layout:auto;}
.lookup-results-table thead th {white-space:normal;}
.lookup-results-table td {word-break:break-word; overflow-wrap:break-word;}
.lookup-results-table td[data-label="예약번호"] {font-family:ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing:.5px;}
/* 3. Mobile full-width detail box */
@media (max-width:720px){
    .res-detail-box {width:100% !important; padding:12px 0 4px !important;}
}
/* 4. Slight tightening of cell padding for better wrapping on narrow widths */
@media (max-width:880px){
    .lookup-results-table thead th, .lookup-results-table tbody td {padding:8px 10px;}
}



.s0301d {
    padding-left:33px;
}

/* Headings (2.2em -> 35.2px) */
.s0301d h1 {
    color: #1a56db;
    font-size: 2.2rem;
    margin-bottom: 15px;
    text-align: center;
    border-bottom: 3px solid #1a56db;
    padding-bottom: 10px;
}

/* Headings (1.8em -> 28.8px) */
.s0301d h2 {
    color: #174dc4;
    font-size: 1.8rem;
    margin-top: 30px;
    margin-bottom: 15px;
    padding-left: 10px;
    border-left: 5px solid #174dc4;
}

/* Headings (1.5em -> 24px) */
.s0301d h3 {
    color: #1a56db;
    font-size: 1.5rem;
    margin-top: 20px;
    margin-bottom: 10px;
}

/* Text elements */
.s0301d p {
    margin-bottom: 10px;
    font-size: 1rem; /* 16px */
}

/* List styles */
.s0301d ul {
    list-style-type: none;
    padding-left: 20px;
    margin-bottom: 20px;
}

.s0301d ul li {
    padding-left: 20px;
    position: relative;
    margin-bottom: 8px;
    font-size: 1rem; /* 16px */
}

.s0301d ul li::before {
    content: '•';
    color: #1a56db;
    font-weight: bold;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
    position: absolute;
    left: 0;
}

/* Special Services Section */
.s0301d .special-services ul li::before {
    content: '★';
    color: #ffc107;
}

/* Target & Legal Basis */
.s0301d .info-box {
    background-color: #ebebeb;
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}

.s0301d .info-box strong {
    color: #174dc4;
}

.s0301d .inspection-table {
    table-layout: auto;
}
.s0301d .inspection-table td:last-child {
    border-right: #e1e1e1 1px solid;
}

/* Procedure */
.s0301d .procedure-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 50px;
    gap: 20px;
}

.s0301d .procedure-step {
    flex-basis: calc(33.33% - 20px);
    margin-bottom: 20px;
    background-color: #edf5ff;
    border: 1px solid #076cab;
    border-radius: 8px;
    padding: 15px;
    text-align: center;
    box-sizing: border-box;
    position: relative;
}

.s0301d .step-number {
    display: block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    background-color: #076cab;
    color: white;
    border-radius: 50%;
    font-size: 1.5rem; /* 24px */
    font-weight: bold;
    margin: -35px -30px 10px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.s0301d .step-content {
    font-size: 0.95rem; /* 15.2px */
    margin-top: 5px;
}

/* Contact Info */
.s0301d .contact-info {
}

.s0301d .contact-info p {
    margin: 5px 0;
    font-size: 1.1rem; /* 17.6px */
}

.s0301d .contact-info strong {
    color: #076cab;
}

.s0301d .contact-info .hc-reser-btn {
    display: inline-block;
    margin-top: 10px;
    padding: 10px 20px;
    background-color: #1a56db;
    color: white;
    border-radius: 5px;
    text-decoration: none;
    font-weight: bold;
    transition: background-color 0.3s ease;
}
.s0301d .contact-info .hc-reser-btn:hover {
    background-color: #174dc4;
}

.s0301d .contact-info .reservation-notes {
    margin-top: 15px;
    font-size: 0.9rem; /* 14.4px */
    color: #555;
}
.s0301d .contact-info .reservation-notes li {
    margin-bottom: 5px;
}

/* Media Queries for Responsiveness */
@media (max-width: 768px) {
    .s0301d .procedure-step {
        flex-basis: calc(50% - 10px);
    }
}

@media (max-width: 480px) {
    .s0301d .procedure-step {
        flex-basis: 100%;
        margin-bottom: 25px;
    }
}