/* Prayer Export Widget — styles */

.qhp-export-widget {
    background: #f8faf9;
    border: 1px solid #c8ddd2;
    border-radius: 8px;
    padding: 24px 28px;
    margin: 32px 0;
    font-family: inherit;
}

.qhp-export-widget[dir="rtl"] {
    text-align: right;
}

.qhp-export-title {
    font-size: 1.15em;
    font-weight: 700;
    color: #1e6438;
    margin: 0 0 16px;
    padding: 0;
}

.qhp-export-controls {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 20px;
}

.qhp-export-label {
    font-size: 0.9em;
    color: #444;
    font-weight: 500;
}

.qhp-export-controls select {
    padding: 6px 10px;
    border: 1px solid #b0ccba;
    border-radius: 4px;
    background: #fff;
    font-size: 0.9em;
    color: #222;
    cursor: pointer;
}

.qhp-export-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 16px;
}

.qhp-export-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 18px;
    border-radius: 6px;
    text-decoration: none;
    font-size: 0.88em;
    font-weight: 600;
    transition: background 0.15s, color 0.15s, opacity 0.15s;
    border: 1px solid transparent;
    cursor: pointer;
    background: #1e6438;
    color: #fff;
}

.qhp-export-btn:hover {
    background: #155230;
    color: #fff;
    text-decoration: none;
}

.qhp-export-btn:focus {
    outline: 2px solid #1e6438;
    outline-offset: 2px;
}

.qhp-export-btn.loading {
    opacity: 0.6;
    pointer-events: none;
    cursor: default;
}

.qhp-export-btn.qhp-export-ical-month,
.qhp-export-btn.qhp-export-ical-year {
    background: #2e6b8a;
}
.qhp-export-btn.qhp-export-ical-month:hover,
.qhp-export-btn.qhp-export-ical-year:hover {
    background: #205068;
}

.qhp-export-btn.qhp-export-png {
    background: #7b4fa6;
}
.qhp-export-btn.qhp-export-png:hover {
    background: #5c3a7d;
}

.qhp-export-disclaimer {
    font-size: 0.78em;
    color: #777;
    margin: 4px 0 0;
    font-style: italic;
}

/* Responsive */
@media (max-width: 600px) {
    .qhp-export-widget {
        padding: 16px;
    }
    .qhp-export-btn {
        padding: 9px 14px;
        font-size: 0.84em;
    }
}