/* =========================================================
   unit.css
   単位ページ専用CSS
   ========================================================= */

/* Page base */
.page-unit .page-content {
    width: 100%;
    max-width: 100%;
    line-height: 1.9;
}

.page-unit .content-section {
    margin: 2rem 0;
}

.page-unit .content-section h2 {
    font-size: 1.3rem;
    font-weight: 700;
    color: #1e2d55;
    margin: 0 0 1rem;
    padding-left: 14px;
    position: relative;
    line-height: 1.5;
}

.page-unit .content-section h2::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.25em;
    width: 4px;
    height: 1.2em;
    background: linear-gradient(to bottom, #d94b71, #f0a6b8);
    border-radius: 2px;
}

.page-unit p {
    font-size: 1rem;
    line-height: 1.9;
    color: #333;
}

/* Table wrapper */
.page-unit .unit-table-wrap {
    width: 100%;
    overflow-x: auto;
    margin: 1.2rem 0 2rem;
}

/* Base table */
.page-unit .unit-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    background: #fff;
    border: 1px solid #e0e0e0;
    font-size: 0.9rem;
    color: #333;
}

/* All cells */
.page-unit .unit-table th,
.page-unit .unit-table td {
    border: 1px solid #e4e4e4;
    padding: 0.85rem 0.7rem;
    text-align: center;
    vertical-align: middle;
    line-height: 1.75;
}

/* Header */
.page-unit .unit-table th {
    background: #f3f5fa;
    color: #1e2d55;
    font-weight: 700;
}

/* Zebra */
.page-unit .unit-table tbody tr:nth-child(even) {
    background: #fafafa;
}

/* Label cells */
.page-unit .unit-table .unit-label {
    background: #f7f8fb;
    color: #1e2d55;
    font-weight: 700;
    text-align: center;
    vertical-align: middle;
}

/* Long text cells */
.page-unit .unit-table .unit-detail {
    text-align: left;
    vertical-align: middle;
    line-height: 1.8;
}

/* =========================================================
   First table: 単位取得対象・期間
   ========================================================= */

.page-unit .unit-period-table {
    font-size: 0.9rem;
}

.page-unit .unit-period-table th,
.page-unit .unit-period-table td {
    text-align: center;
    vertical-align: middle;
}

.page-unit .unit-period-table .unit-label {
    width: 22%;
}

/* =========================================================
   Second table: 対象セッション
   ========================================================= */

.page-unit .unit-session-table {
    font-size: 0.86rem;
}

.page-unit .unit-session-table th,
.page-unit .unit-session-table td {
    padding: 0.8rem 0.6rem;
    text-align: center;
    vertical-align: middle;
}

/* Column widths */
.page-unit .unit-session-table th:nth-child(1),
.page-unit .unit-session-table td:nth-child(1) {
    width: 6%;
}

.page-unit .unit-session-table th:nth-child(2),
.page-unit .unit-session-table td:nth-child(2) {
    width: 15%;
}

.page-unit .unit-session-table th:nth-child(3),
.page-unit .unit-session-table td:nth-child(3) {
    width: 29%;
}

.page-unit .unit-session-table th:nth-child(4),
.page-unit .unit-session-table td:nth-child(4),
.page-unit .unit-session-table th:nth-child(5),
.page-unit .unit-session-table td:nth-child(5),
.page-unit .unit-session-table th:nth-child(6),
.page-unit .unit-session-table td:nth-child(6),
.page-unit .unit-session-table th:nth-child(7),
.page-unit .unit-session-table td:nth-child(7) {
    width: 12.5%;
    text-align: center;
    vertical-align: middle;
}

/* Theme column only */
.page-unit .unit-session-table td:nth-child(3) {
    text-align: left;
    vertical-align: middle;
}

/* Prevent awkward breaking */
.page-unit .unit-session-table th,
.page-unit .unit-session-table td {
    word-break: keep-all;
    overflow-wrap: break-word;
}

/* Symbols */
.page-unit .unit-table .unit-symbol {
    font-weight: 700;
    text-align: center;
    vertical-align: middle;
}

/* Notes */
.page-unit .unit-notes {
    margin-top: 1rem;
    font-size: 0.95rem;
    line-height: 1.9;
}

.page-unit .unit-notes p {
    margin-bottom: 0.5rem;
}

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 768px) {
    .page-unit .unit-table {
        min-width: 900px;
        font-size: 0.85rem;
    }

    .page-unit .unit-session-table {
        min-width: 1100px;
        font-size: 0.82rem;
    }

    .page-unit .unit-table th,
    .page-unit .unit-table td {
        padding: 0.7rem 0.55rem;
    }

    .page-unit .content-section h2 {
        font-size: 1.2rem;
    }
}