/* DL Teaching Hub — Front-end styles */

.dlth-archive-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 16px;
}

/* ── Filters ── */
.dlth-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 28px;
    align-items: center;
}

.dlth-filters select,
.dlth-filters .dlth-search {
    padding: 8px 14px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 14px;
    background: #fff;
    min-width: 160px;
    cursor: pointer;
    transition: border-color 0.2s;
}

.dlth-filters select:focus,
.dlth-filters .dlth-search:focus {
    border-color: #0073aa;
    outline: none;
}

.dlth-search { min-width: 220px; }

/* ── Grid ── */
.dlth-grid {
    display: grid;
    gap: 24px;
    grid-template-columns: repeat(3, 1fr);
}

.dlth-col-1 { grid-template-columns: 1fr; }
.dlth-col-2 { grid-template-columns: repeat(2, 1fr); }
.dlth-col-3 { grid-template-columns: repeat(3, 1fr); }
.dlth-col-4 { grid-template-columns: repeat(4, 1fr); }

@media (max-width: 900px) {
    .dlth-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 600px) {
    .dlth-grid { grid-template-columns: 1fr !important; }
    .dlth-filters { flex-direction: column; }
    .dlth-filters select,
    .dlth-filters .dlth-search { width: 100%; min-width: unset; }
}

/* ── Card ── */
.dlth-card {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    overflow: hidden;
    transition: box-shadow 0.2s, transform 0.2s;
    display: flex;
    flex-direction: column;
}

.dlth-card:hover {
    box-shadow: 0 6px 24px rgba(0,0,0,.10);
    transform: translateY(-2px);
}

.dlth-card-thumb img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    display: block;
}

.dlth-card-body {
    padding: 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.dlth-tag {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .5px;
    padding: 3px 8px;
    border-radius: 4px;
    margin-right: 4px;
}

.dlth-grade   { background: #e8f4fd; color: #0073aa; }
.dlth-subject { background: #f0fdf4; color: #166534; }

.dlth-card-title {
    font-size: 16px;
    font-weight: 700;
    margin: 0;
    line-height: 1.4;
}

.dlth-card-title a {
    color: #1a1a1a;
    text-decoration: none;
}

.dlth-card-title a:hover { color: #0073aa; }

.dlth-card-excerpt {
    font-size: 13px;
    color: #666;
    margin: 0;
    flex: 1;
}

.dlth-btn {
    display: inline-block;
    margin-top: 8px;
    padding: 7px 18px;
    background: #0073aa;
    color: #fff !important;
    border-radius: 5px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    align-self: flex-start;
    transition: background 0.2s;
}

.dlth-btn:hover { background: #005a87; }

/* ── Pagination ── */
.dlth-pagination {
    margin-top: 32px;
    display: flex;
    justify-content: center;
    gap: 8px;
    flex-wrap: wrap;
}

.dlth-pagination button {
    padding: 7px 14px;
    border: 1px solid #ddd;
    background: #fff;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.2s;
}

.dlth-pagination button:hover,
.dlth-pagination button.active {
    background: #0073aa;
    color: #fff;
    border-color: #0073aa;
}

/* ── Loading / Empty ── */
.dlth-loading {
    text-align: center;
    padding: 40px;
    color: #888;
    font-size: 15px;
}

.dlth-empty {
    grid-column: 1 / -1;
    text-align: center;
    padding: 48px;
    color: #888;
    font-size: 15px;
}

/* Page Builder HTML Styles */
.textbook-wrapper{max-width:860px;margin:50px auto;padding:35px 28px;background:#eeeeee;border-radius:14px;box-shadow:0 6px 18px rgba(0,0,0,.07);font-family:'Segoe UI',sans-serif}
.home .textbook-wrapper{background:transparent!important;box-shadow:none!important;border:none!important;padding:0!important}
.form-title{text-align:center;font-size:26px;font-weight:700;color:#1a2a6c;margin-bottom:25px}
.textbook-form .form-row{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-end}
.form-group{flex:1 1 30%;display:flex;flex-direction:column}
.button-group{flex:1 1 100%}
label{font-weight:600;font-size:15px;margin-bottom:6px;color:#2c3e50}
.select2-container--default .select2-selection--single{height:44px;border-radius:8px;border:1.5px solid #2980b9;padding:6px 12px;font-size:15px;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.select2-selection__rendered{line-height:30px!important;font-weight:600;color:#34495e}
.select2-dropdown{border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.08);max-height:240px;overflow-y:auto}
.select2-results__option--highlighted{background-color:#1a2a6c!important;color:#fff!important}
.filter-button{height:44px;background:linear-gradient(90deg,#1a2a6c,#2980b9);border:none;color:#fff;font-weight:700;font-size:16px;border-radius:10px;cursor:pointer;transition:.3s ease;box-shadow:0 4px 12px rgba(26,42,108,.3);width:100%}
.filter-button:hover{background:linear-gradient(90deg,#162265,#1c58a0)}
.support-message{margin-top:20px;text-align:center;font-size:15px;color:#555}
.support-message a{color:#1a2a6c;font-weight:700;text-decoration:none}
.support-message a:hover{text-decoration:underline}
@media(min-width:769px){.button-group{flex:1 1 30%}}
@media(max-width:768px){.form-group{flex:1 1 48%}.button-group{flex:1 1 100%}.filter-button{margin-top:8px}}

/* ── DLTH Archive Filter — mobile-first ───────────────────────── */
.dlth-filter-outer{width:100%;max-width:860px;margin:20px auto;display:flex;flex-direction:column;align-items:center;padding:20px;box-sizing:border-box;background:#eef2f7;border-radius:16px;}
.dlth-filter-box{width:100%;max-width:860px;background:#fff;border:1px solid #d8e2f0;border-radius:16px;padding:28px 20px 24px;box-sizing:border-box;}
.dlth-filter-box h2{text-align:center;font-size:22px;font-weight:800;color:#1a2a6c;margin:0 0 22px;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;}
.dlth-filter-fields{display:flex;flex-direction:column;gap:12px;}
.dlth-filter-field{display:flex;flex-direction:column;gap:5px;}
.dlth-filter-field label{font-weight:700;font-size:13px;color:#333;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;}
.dlth-filter-field select{width:100%;height:48px;padding:0 40px 0 14px;border:2px solid #2980b9;border-radius:10px;font-size:15px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%232980b9' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 14px center;color:#333;appearance:none;-webkit-appearance:none;cursor:pointer;box-sizing:border-box;}
.dlth-filter-field select:focus{outline:none;border-color:#1a2a6c;box-shadow:0 0 0 3px rgba(41,128,185,.15);}
.dlth-filter-btn{width:100%;height:50px;background:linear-gradient(135deg,#1a2a6c,#2980b9);color:#fff;border:none;border-radius:10px;font-size:16px;font-weight:700;cursor:pointer;font-family:inherit;margin-top:4px;transition:opacity .2s;}
.dlth-filter-btn:hover{opacity:.9;}
.dlth-filter-support{text-align:center;margin-top:14px;font-size:13px;color:#666;font-family:inherit;}
.dlth-filter-support a{color:#1a2a6c;font-weight:700;text-decoration:none;}
.dlth-filter-support a:hover{text-decoration:underline;}
.dlth-filter-home{display:flex;align-items:center;justify-content:center;gap:6px;align-self:center;width:fit-content;margin:20px auto 0;padding:10px 28px;background:linear-gradient(90deg,#1a2a6c,#2980b9);color:#fff!important;border-radius:8px;font-weight:700;font-size:14px;text-decoration:none!important;font-family:inherit;}
.dlth-filter-home:hover{opacity:.9;}
@media(min-width:640px){.dlth-filter-box{padding:36px 40px 30px;}.dlth-filter-box h2{font-size:28px;margin-bottom:28px;}.dlth-filter-fields{flex-direction:row;flex-wrap:wrap;align-items:flex-end;}.dlth-filter-field{flex:1 1 180px;}.dlth-filter-btn{width:auto;height:48px;padding:0 32px;flex-shrink:0;align-self:flex-end;}}
/* ── DLTH Results Page — mobile-first responsive ──────────────── */
.dlth-rp{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;max-width:1080px;margin:0 auto;padding:0 12px 40px;box-sizing:border-box;}
.dlth-rp .dlth-bc-band{margin-bottom:24px;}
.dlth-rp-head{margin-bottom:18px;}
.dlth-rp-h1{font-size:22px;font-weight:800;color:#1a2a6c;margin:0 0 4px;line-height:1.2;}
.dlth-rp-sub{font-size:13px;color:#888;margin:0;}
.dlth-rp-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-bottom:28px;}
@media(min-width:520px){.dlth-rp-grid{grid-template-columns:repeat(2,1fr);}}
@media(min-width:860px){.dlth-rp-grid{grid-template-columns:repeat(3,1fr);}}
.dlth-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 1px 3px rgba(0,0,0,.07);transition:box-shadow .2s,transform .18s;}
.dlth-card:hover{box-shadow:0 6px 22px rgba(26,42,108,.14);transform:translateY(-3px);}
.dlth-card-top{background:linear-gradient(135deg,#1a2a6c 0%,#2980b9 100%);height:90px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.dlth-card-icon{font-size:38px;line-height:1;}
.dlth-card-body{padding:14px 14px 0;flex:1;display:flex;flex-direction:column;}
.dlth-card-title{font-size:14px;font-weight:700;color:#1a2a6c;margin:0 0 8px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.dlth-card-tags{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:10px;flex:1;}
.dlth-card-tag{font-size:11px;background:#eef2f7;color:#1a2a6c;border-radius:4px;padding:2px 8px;font-weight:600;white-space:nowrap;}
.dlth-card-btns{display:flex;border-top:1px solid #f0f4f8;}
.dlth-card-btn{flex:1;padding:11px 4px;text-align:center;font-size:13px;font-weight:700;text-decoration:none!important;display:flex;align-items:center;justify-content:center;gap:4px;transition:background .15s;border:none;cursor:pointer;}
.dlth-card-btn-view{background:#2980b9;color:#fff!important;border-radius:0 0 0 11px;}
.dlth-card-btn-dl{background:#27ae60;color:#fff!important;border-radius:0 0 11px 0;}
.dlth-card-btn-view:hover{background:#216fa0;color:#fff!important;}
.dlth-card-btn-dl:hover{background:#1e8449;color:#fff!important;}
.dlth-card-btn-off{opacity:.4;cursor:not-allowed;}
.dlth-rp-empty{text-align:center;padding:48px 20px;background:#fff;border:1px solid #e2e8f0;border-radius:12px;}
.dlth-rp-empty-ico{font-size:44px;margin-bottom:12px;}
.dlth-rp-empty h3{font-size:18px;color:#1a2a6c;margin:0 0 6px;}
.dlth-rp-empty p{color:#888;font-size:14px;margin:0;}
.dlth-rp-pages{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin:4px 0 28px;}
.dlth-rp-pages a,.dlth-rp-pages span{min-width:38px;padding:8px 12px;border:1.5px solid #d8e2f0;border-radius:8px;font-size:14px;font-weight:700;text-align:center;text-decoration:none;color:#1a2a6c;background:#fff;transition:all .15s;display:inline-block;}
.dlth-rp-pages a:hover,.dlth-rp-pages span.cur{background:#1a2a6c;color:#fff;border-color:#1a2a6c;}
.dlth-rp-foot{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;padding-top:20px;border-top:1px solid #e8e8e8;margin-top:4px;}
.dlth-rp-btn-back{display:inline-flex;align-items:center;gap:6px;padding:10px 22px;background:#fff;color:#1a2a6c;border-radius:8px;font-size:14px;font-weight:700;text-decoration:none;border:1.5px solid #d8e2f0;}
.dlth-rp-btn-back:hover{background:#f0f4fb;color:#1a2a6c;}
.dlth-rp-btn-home{display:inline-flex;align-items:center;gap:6px;padding:10px 26px;background:linear-gradient(90deg,#1a2a6c,#2980b9);color:#fff!important;border-radius:8px;font-size:14px;font-weight:700;text-decoration:none!important;}
.dlth-rp-btn-home:hover{opacity:.92;}
@media(max-width:480px){.dlth-rp-h1{font-size:19px;}.dlth-card-top{height:70px;}.dlth-card-icon{font-size:30px;}}

/* Keep the top contact bar items (address, emails, phone) on a single row */
.elementor-element-db8f6eb ul.elementor-icon-list-items.elementor-inline-items{
    flex-wrap: nowrap !important;
    justify-content: center;
    align-items: center;
}
.elementor-element-db8f6eb .elementor-icon-list-item{
    white-space: nowrap;
}
.elementor-element-db8f6eb .elementor-icon-list-item.elementor-inline-item{
    margin-left: 16px !important;
    margin-right: 16px !important;
}