/* ==========================================================================
   Seraj — Author Studio overrides.
   Loads after partner-app.css and only inside /author-hub/.
   ========================================================================== */

.sa-body { --sp-brand: var(--seraj-color-primary, #14776a); }

/* Auth screens ---------------------------------------------------------- */
.sa-auth__grid { display: grid; grid-template-columns: minmax(0, 1fr); min-height: 100vh; }
@media (min-width: 900px) {
	.sa-auth__grid { grid-template-columns: minmax(0, 460px) minmax(0, 1fr); }
}

/* Dashboard tiles ------------------------------------------------------- */
.sa-tiles { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); margin-bottom: 1.4rem; }
.sa-tile {
	background: #fff; border: 1px solid var(--sp-line); border-radius: 14px;
	padding: 1rem 1.1rem; display: flex; flex-direction: column; gap: .25rem;
}
.sa-tile__n { font-size: 1.7rem; font-weight: 700; line-height: 1.1; }
.sa-tile__l { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--sp-muted); font-weight: 700; }

/* Editor ---------------------------------------------------------------- */
.sa-editor { display: grid; gap: 1.2rem; align-items: start; }
@media (min-width: 1080px) { .sa-editor { grid-template-columns: minmax(0, 1fr) 320px; } }
.sa-editor__side { display: grid; gap: 1rem; }
.sa-title-input {
	width: 100%; font-size: 1.35rem; font-weight: 700; padding: .8rem .9rem;
	border: 1px solid var(--sp-line); border-radius: 12px; background: #fff;
}
.sa-title-input:focus { outline: none; border-color: var(--sp-brand); box-shadow: 0 0 0 3px rgba(20, 119, 106, .12); }
.sa-body-input { min-height: 420px; font-family: inherit; line-height: 1.7; }
.sa-sticky-actions {
	position: sticky; bottom: 0; z-index: 5; display: flex; flex-wrap: wrap; gap: .6rem;
	padding: .8rem 0; background: linear-gradient(to top, var(--sp-bg, #f6f7f8) 65%, transparent);
}
.sa-count { font-size: .8rem; color: var(--sp-muted); }

/* Media grid ------------------------------------------------------------ */
.sa-media { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
.sa-media figure { margin: 0; border: 1px solid var(--sp-line); border-radius: 12px; overflow: hidden; background: #fff; }
.sa-media img { display: block; width: 100%; height: 120px; object-fit: cover; }
.sa-media figcaption { padding: .45rem .55rem; display: flex; gap: .4rem; align-items: center; justify-content: space-between; font-size: .74rem; }
.sa-thumb-preview img { max-width: 100%; border-radius: 12px; display: block; }

/* Notification feed ----------------------------------------------------- */
.sa-feed { display: grid; gap: .7rem; }
.sa-feed__item {
	display: grid; gap: .2rem; padding: .85rem 1rem; background: #fff;
	border: 1px solid var(--sp-line); border-left-width: 3px; border-radius: 12px;
}
.sa-feed__item.is-unread { border-left-color: var(--sp-brand); background: #f7fdfb; }
.sa-feed__meta { font-size: .74rem; color: var(--sp-muted); }
.sa-feed__item img { max-width: 100%; border-radius: 10px; margin-top: .5rem; }

/* Definition list used on Profile + Proposal ----------------------------- */
.sp-facts { display: grid; grid-template-columns: minmax(120px, auto) 1fr; gap: .4rem 1rem; margin: .6rem 0 1.1rem; }
.sp-facts dt { font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; color: var(--sp-muted); font-weight: 700; }
.sp-facts dd { margin: 0; }

/* Inline single-button forms + action rows ------------------------------- */
.sp-inline-form { display: inline-block; margin: .8rem 0; }
.sp-row-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1rem; }

/* Password reveal button ------------------------------------------------- */
.sp-field, .sa-form label { position: relative; }
.sp-eye {
	position: absolute; right: .5rem; bottom: .45rem; line-height: 1;
	background: none; border: 0; cursor: pointer; font-size: 1rem; padding: .25rem;
	opacity: .6; border-radius: 8px;
}
.sp-eye:hover, .sp-eye:focus-visible { opacity: 1; outline: none; box-shadow: 0 0 0 3px rgba(20, 119, 106, .14); }

/* Editor body ------------------------------------------------------------ */
.sa-editor__fields { border: 0; padding: 0; margin: 0; min-width: 0; display: contents; }
.sa-editor__fields[disabled] { opacity: .72; }
.sa-editor__body .wp-editor-container { border: 1px solid var(--sp-line); border-radius: 12px; overflow: hidden; }
.sa-editor__body .wp-editor-area { font-family: inherit; line-height: 1.7; }
.sa-editor__tools { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem; margin-top: .5rem; }
.sa-insert { margin-top: .7rem; }
.sa-media figure.is-picked { outline: 2px solid var(--sp-brand); outline-offset: 1px; }
.sa-media figure:focus-visible { outline: 2px solid var(--sp-brand); outline-offset: 2px; }
.sa-restore { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
