/* ============================================
   Soulution Premium Sections — Client Dashboard
   Calm, clean, friendly. Big touch targets.
   ============================================ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,600;0,700&family=Inter:wght@400;500;600;700&display=swap');

/* News + Bookshelf CSS load site-wide and declare the shared :root
   color variables (from Settings → Premium Sections → Colors), so this
   file just references them directly — no local redeclaration needed. */
.snei-dash-wrap {
	--snei-line: #e7ddc6;
	max-width: 760px; margin: 0 auto; padding: 40px 20px 90px;
	font-family: 'Inter', sans-serif; color: var(--snei-heading) !important;
}

.snei-dash-login { text-align: center; padding: 60px 20px; }
.snei-dash-header { text-align: center; margin-bottom: 28px; }
.snei-dash-header h2 { font-family: 'Playfair Display', serif; font-size: 30px; margin: 0 0 8px; color: var(--snei-heading) !important; }
.snei-dash-header p { color: var(--snei-desc) !important; font-size: 14px; margin: 0; }

.snei-dash-notice {
	background: #e8f3ea; border: 1px solid #b9dcc1; color: #245a32;
	padding: 14px 18px; border-radius: 10px; margin-bottom: 24px; font-size: 14px; text-align: center;
}
.snei-dash-notice-error { background: #fbe9e7; border-color: #f0bdb4; color: #8a2e21; }

/* CSS-only tabs */
.snei-tab-radio { display: none; }
.snei-dash-tabs { display: flex; gap: 10px; margin-bottom: 26px; }
.snei-dash-tab-label {
	flex: 1; text-align: center; padding: 14px 0; border-radius: 10px; cursor: pointer;
	background: #fff; border: 1px solid var(--snei-line); font-weight: 600; font-size: 15px; color: var(--snei-desc) !important;
	transition: all .2s ease;
}
#snei-tab-news:checked ~ .snei-dash-tabs label[for="snei-tab-news"],
#snei-tab-books:checked ~ .snei-dash-tabs label[for="snei-tab-books"] {
	background: var(--snei-btn-bg) !important; color: var(--snei-btn-text) !important; border-color: var(--snei-btn-bg) !important;
}

.snei-dash-panel { display: none; }
#snei-tab-news:checked ~ .snei-panel-news,
#snei-tab-books:checked ~ .snei-panel-books { display: block; }

/* Cards */
.snei-dash-card {
	background: #fff; border: 1px solid var(--snei-line); border-radius: 16px;
	padding: 28px 26px; margin-bottom: 26px; box-shadow: 0 14px 30px -18px rgba(23,20,17,0.12);
}
.snei-dash-card h3 { font-family: 'Playfair Display', serif; font-size: 21px; margin: 0 0 18px; color: var(--snei-heading) !important; }
.snei-format-heading { font-size: 16px; margin: 24px 0 4px; color: var(--snei-heading) !important; }

/* Form fields */
.snei-dash-card label { display: block; font-size: 13.5px; font-weight: 600; margin: 16px 0 6px; color: var(--snei-heading) !important; }
.snei-dash-card label:first-of-type { margin-top: 0; }
.snei-help { font-weight: 400; color: var(--snei-desc) !important; font-size: 12.5px; }
.snei-dash-card input[type="text"],
.snei-dash-card input[type="url"],
.snei-dash-card input[type="number"],
.snei-dash-card input[type="email"],
.snei-dash-card textarea {
	width: 100%; box-sizing: border-box; border: 1px solid var(--snei-line); border-radius: 10px;
	padding: 12px 14px; font-size: 15px; font-family: inherit; min-height: 46px;
}
.snei-dash-card textarea { min-height: 80px; resize: vertical; }
.snei-dash-card input[type="file"] {
	width: 100%; padding: 10px; border: 1px dashed var(--snei-line); border-radius: 10px; font-size: 13px; background: #fbf9f3;
}
.snei-current-thumb { display: block; max-width: 140px; border-radius: 8px; margin: 8px 0; }
.snei-current-video { display: block; max-width: 260px; max-height: 160px; border-radius: 8px; margin: 8px 0; background: #000; }
.snei-video-or { margin-top: 12px !important; font-size: 12.5px !important; font-weight: 500 !important; color: var(--snei-desc) !important; }
.snei-current-file { font-weight: 400; color: var(--snei-desc) !important; font-size: 12px; }

.snei-checkbox-label { display: flex; align-items: center; gap: 8px; font-weight: 500; font-size: 14px; margin: 10px 0; }
.snei-checkbox-label input[type="checkbox"],
.snei-checkbox-label input[type="radio"] { width: 19px; height: 19px; flex-shrink: 0; }
.snei-checkbox-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 4px; margin-top: 8px; }
.snei-inline-radio { display: inline-flex; margin-right: 18px; }

.snei-format-block { border: 1px solid var(--snei-line); border-radius: 12px; padding: 16px 18px; margin-top: 14px; background: #fbf9f3; }
.snei-format-toggle { margin: 0 0 4px; font-size: 15px; }
.snei-format-fields { margin-top: 10px; padding-left: 4px; }

.snei-dash-actions { display: flex; gap: 12px; margin-top: 24px; }
.snei-dash-btn {
	background: var(--snei-btn-bg) !important; color: var(--snei-btn-text) !important; border: none; border-radius: 10px;
	padding: 14px 26px; font-size: 15px; font-weight: 700; cursor: pointer; flex: 1;
	transition: filter .2s ease;
}
.snei-dash-btn:hover { filter: brightness(1.15); }
.snei-dash-btn-secondary {
	background: #fff; color: var(--snei-desc) !important; border: 1px solid var(--snei-line); border-radius: 10px;
	padding: 14px 22px; font-size: 14px; text-decoration: none; text-align: center;
}

/* Lists */
.snei-dash-empty { color: var(--snei-desc) !important; font-size: 14px; }
.snei-dash-list { display: flex; flex-direction: column; gap: 10px; }
.snei-dash-row {
	display: flex; align-items: center; gap: 14px; border: 1px solid var(--snei-line); border-radius: 12px; padding: 10px 14px;
}
.snei-dash-row-thumb { width: 50px; height: 50px; border-radius: 8px; background-size: cover; background-position: center; background-color: #ece5d4; flex-shrink: 0; }
.snei-dash-row-info { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.snei-dash-row-info strong { font-size: 14.5px; line-height: 1.3; }
.snei-dash-row-info span { font-size: 12.5px; color: var(--snei-desc) !important; margin-top: 2px; }
.snei-dash-row-actions { display: flex; gap: 8px; flex-shrink: 0; }
.snei-row-btn {
	border: 1px solid var(--snei-line); background: #fff; border-radius: 8px; padding: 8px 14px;
	font-size: 12.5px; font-weight: 600; cursor: pointer; text-decoration: none; color: var(--snei-heading) !important;
}
.snei-row-btn-danger { color: #a3372f !important; border-color: #f0bdb4; }

@media (max-width: 560px) {
	.snei-checkbox-grid { grid-template-columns: 1fr; }
	.snei-dash-row { flex-wrap: wrap; }
	.snei-dash-row-actions { width: 100%; justify-content: flex-end; }
}