/* ============================================================
   webpagetes.css — stili specifici di webpagetes.php
   (master/detail Monografie: testate + righe)

   Base comune: css/ls_style.css (variabili :root, bar1/bar2, .btn,
   .btn-icon, .form-row, .flash, #layout, #sidebar, .sidebar-header).
   Qui solo cio' che ls_style.css non fornisce. Prefisso .wpt- per
   non collidere con le classi del CRUD generico.
   ============================================================ */

/* ---- Sidebar: elenco testate ---- */
#sidebar.wpt-sidebar {
    --sidebar-w: 300px;
    padding: 0;
}
.wpt-list-item {
    border-bottom: 1px solid #e0e5ea;
    border-left: 3px solid transparent;
    padding: 7px 10px;
}
.wpt-list-item a {
    display: block;
    color: inherit;
    text-decoration: none;
}
.wpt-list-item:hover  { background: #edf0f4; }
.wpt-list-item.active { background: #eaf4fb; border-left-color: var(--btn-primary); }
.wpt-list-item .wpt-li-title { font-size: 12px; }
.wpt-small { font-size: 11px; color: #5d6d7e; }
.wpt-muted { color: #7f8c8d; }
.wpt-empty { padding: 14px 10px; font-style: italic; color: #888; }

/* ---- Area principale ---- */
#main-area.wpt-main { padding: 14px; }
.wpt-main .flash { margin: 0 0 10px; }
.flash.wpt-flash-sticky { animation: none; }   /* gli errori non devono sparire da soli */

/* ---- Pannelli (testata / righe) ---- */
.wpt-panel {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 4px;
    margin-bottom: 14px;
}
.wpt-panel-title {
    background: var(--header-bg);
    color: var(--header-fg);
    padding: 6px 10px;
    font-weight: 700;
    border-bottom: 1px solid var(--border);
}
.wpt-panel-body { padding: 12px; }

/* ---- Form testata (usa .form-row di ls_style.css) ---- */
.wpt-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 16px;
}
.wpt-form-grid .form-row label { min-width: 110px; }
.wpt-form-grid .form-row.wpt-full { grid-column: 1 / -1; }
.wpt-form-grid textarea { min-height: 70px; }

/* ---- Griglia righe ---- */
table.wpt-grid {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 12px;
}
table.wpt-grid th,
table.wpt-grid td {
    border: 1px solid var(--border);
    padding: 3px 4px;
    vertical-align: top;
}
table.wpt-grid thead th {
    background: var(--header-bg);
    color: var(--header-fg);
    font-size: 11px;
    font-weight: 700;
    text-align: left;
}
table.wpt-grid td input[type=text],
table.wpt-grid td input[type=number] {
    width: 100%;
    border: 1px solid #b0bec5;
    border-radius: 3px;
    padding: 3px 5px;
    font-size: 12px;
    font-family: var(--font);
}
table.wpt-grid td input:focus { outline: none; border-color: var(--btn-primary); }
table.wpt-grid td input[readonly] { background: #f4f6f8; color: #555; }

.wpt-col-actions { width: 112px; }
.wpt-col-idriga  { width: 64px; }
.wpt-col-idogg   { width: 90px; }
.wpt-col-num     { width: 58px; }

.wpt-actions-cell { white-space: nowrap; text-align: center; }
.wpt-actions-cell .btn-icon { font-size: 14px; padding: 2px 6px; }
.btn-ext { color: #8e44ad; }
.btn-ext:hover { background: #f4ecf7; border-color: #d2b4de; }

/* ---- Riga teaser sotto ogni riga ---- */
.teaser-row td {
    background: #fafafa;
    border-top: none;
    padding: 6px 8px 8px 8px;
}
.teaser-box {
    font-size: 11px;
    font-style: italic;
    color: #555;
    line-height: 1.25;
    white-space: normal;
    border-left: 3px solid var(--border);
    padding-left: 8px;
    min-height: 18px;
}

/* ---- Righe marcate per cancellazione ---- */
.row-deleted-main td,
.row-deleted-teaser td {
    background: var(--error-bg) !important;
    opacity: 0.7;
}

.wpt-hint { margin-top: 8px; font-size: 11px; color: #7f8c8d; }