/* ============================================================
   SORVA — skin Roundcube (extends elastic)
   Charte : encre #0e1116 · cuivre #b9905b · crème #f3ecdf
   Typo  : Cormorant Garamond (display) · Inter (UI) · Noto Sans SC (CJK)
   ============================================================ */
/* base elastic RECOLORÉE Sorva (bleu->cuivre, froid->crème) PUIS surcouche */
@import url('elastic-sorva.min.css');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;1,500&family=Inter:wght@300;400;500;600&family=Noto+Sans+SC:wght@400;500;600&display=swap');

:root{
  --encre:#0e1116; --panneau:#22252c; --cuivre:#b9905b; --cuivre-clair:#d4ad77;
  --creme:#f3ecdf; --creme-alt:#ece4d3; --bordure:#e7ddc7;
  --gris:#5e6068; --gris-2:#6b6d75;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Inter','Noto Sans SC',system-ui,-apple-system,sans-serif;
}

/* ===================== LOGIN ===================== */
.sorva-auth{
  position:fixed; inset:0; z-index:2000;
  display:grid; grid-template-columns:1.08fr 0.92fr;
  background:var(--creme); font-family:var(--sans); color:var(--encre);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
.sorva-auth *{box-sizing:border-box}

/* -- panneau marque (gauche) -- */
.sorva-brand{
  position:relative; overflow:hidden;
  background:linear-gradient(135deg,#1b150e 0%,#120e09 55%,#0b0907 100%);
  color:var(--creme); padding:46px 54px; display:flex; flex-direction:column;
}
.sorva-gridlines{
  position:absolute; inset:0; opacity:.5;
  background-image:linear-gradient(rgba(185,144,91,.06) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(185,144,91,.06) 1px,transparent 1px);
  background-size:54px 54px;
  -webkit-mask-image:radial-gradient(120% 100% at 30% 30%,#000 40%,transparent 100%);
          mask-image:radial-gradient(120% 100% at 30% 30%,#000 40%,transparent 100%);
}
.sorva-watermark{
  position:absolute; right:-180px; bottom:-160px; width:760px; height:760px;
  opacity:.07; pointer-events:none; transform-origin:50% 50%;
  animation:sorvaRose 120s linear infinite;
}
@keyframes sorvaRose{to{transform:rotate(360deg)}}
@keyframes sorvaFade{from{opacity:0; transform:translateY(10px)}to{opacity:1; transform:none}}
@media (prefers-reduced-motion:reduce){ .sorva-watermark{animation:none} }
.sorva-lockup{display:flex; align-items:center; gap:13px; position:relative; z-index:1}
.sorva-lockup .wordmark{font-family:var(--serif); font-size:26px; letter-spacing:.42em; padding-left:.42em; font-weight:500; color:var(--creme)}
.sorva-lockup .mark{transform-origin:50% 50%; animation:sorvaRose 150s linear infinite reverse}
.sorva-card{animation:sorvaFade .7s ease both}
.sorva-hero{margin-top:auto; position:relative; z-index:1; max-width:30ch}
.sorva-hero h1{font-family:var(--serif); font-weight:500; font-size:54px; line-height:1.05; letter-spacing:-.01em; margin:0 0 22px}
.sorva-hero h1 em{font-style:italic; color:var(--cuivre)}
.sorva-hero p{font-size:14px; line-height:1.7; color:#b8b09f; max-width:42ch; margin:0}
.sorva-meta{display:flex; gap:46px; margin-top:54px; position:relative; z-index:1}
.sorva-meta span{display:flex; flex-direction:column; gap:3px}
.sorva-meta b{font-size:12.5px; font-weight:600; color:var(--creme)}
.sorva-meta i{font-style:normal; font-family:ui-monospace,'SF Mono',Menlo,monospace; font-size:11px; color:#7c7565; letter-spacing:.02em}

/* -- panneau formulaire (droite) -- */
.sorva-panel{display:flex; flex-direction:column; justify-content:center; align-items:center; padding:40px; position:relative}
.sorva-card{width:100%; max-width:372px}
.sorva-card .eyebrow{font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--cuivre); font-weight:600; margin-bottom:20px;
  display:flex; align-items:center; gap:12px}
.sorva-card .eyebrow::after{content:""; flex:1; height:1px; background:linear-gradient(90deg,var(--bordure),transparent)}
.sorva-card h2{font-family:var(--serif); font-weight:600; font-size:40px; line-height:1; margin:0 0 8px; color:var(--encre)}
.sorva-card .sub{font-size:14px; color:var(--gris); margin:0 0 30px}

/* formulaire (sortie de l'objet RC loginform, sélecteurs larges) */
.sorva-card form, .sorva-card .propform, .sorva-card table{width:100%; border:none}
/* labels flottants Elastic = cachés (les placeholders suffisent, look épuré) */
.sorva-card label{display:none!important}
.sorva-card td, .sorva-card tr, .sorva-card .form-group, .sorva-card .row{display:block; width:100%; background:none!important}
.sorva-card input:not([type=checkbox]):not([type=radio]){
  width:100%!important; height:46px; padding:0 14px; margin:0 0 17px;
  background:#fbf8f1; border:1px solid var(--bordure); border-radius:4px;
  font-family:var(--sans); font-size:14px; color:var(--encre); outline:none; transition:border-color .15s, box-shadow .15s;
}
.sorva-card input:not([type=checkbox]):not([type=radio]):focus{
  border-color:var(--cuivre); box-shadow:0 0 0 3px rgba(185,144,91,.16);
}
.sorva-card input::placeholder{color:#a9a293}
/* bouton */
.sorva-card button, .sorva-card input[type=submit], .sorva-card .btn-primary, .sorva-card .btn{
  width:100%!important; height:48px; margin-top:6px;
  background:var(--encre)!important; color:#fff!important; border:none!important; border-radius:4px;
  font-family:var(--sans); font-size:13px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; cursor:pointer;
  transition:background .2s; box-shadow:none;
}
.sorva-card button:hover, .sorva-card input[type=submit]:hover, .sorva-card .btn-primary:hover{background:#1c2129!important}
.sorva-card .btn::before{display:none}
/* "rester connecté" */
.sorva-card input[type=checkbox]{accent-color:var(--cuivre); margin-right:7px}
.sorva-card .boxtitle, .sorva-card #message{display:none}
/* neutraliser le style de formulaire elastic dans la carte (icônes/bordures/groupes) */
.sorva-card .input-group-prepend, .sorva-card .input-group-append, .sorva-card .input-group-text{ display:none !important }
.sorva-card .input-group{ display:block !important; border:none !important; box-shadow:none !important; background:none !important }
.sorva-card .form-group, .sorva-card .row, .sorva-card .formcontent{ border:none !important; box-shadow:none !important; background:none !important; padding:0 !important; margin:0 !important }
.sorva-card .input-group>input, .sorva-card input.form-control{ border:1px solid var(--bordure) !important; box-shadow:none !important; border-radius:4px !important }

.sorva-links{margin-top:22px; padding-top:18px; border-top:1px solid var(--bordure); font-size:13px; display:flex; gap:10px; align-items:center}
.sorva-links a{color:var(--cuivre); text-decoration:none}
.sorva-links a:hover{text-decoration:underline}
.sorva-links .sep{color:var(--gris-2)}
.sorva-foot{position:absolute; bottom:30px; left:0; right:0; text-align:center}
.sorva-foot .foot-brand{font-family:ui-monospace,Menlo,monospace; font-size:11px; letter-spacing:.22em; color:var(--gris-2)}

@media (max-width:880px){
  .sorva-auth{grid-template-columns:1fr}
  .sorva-brand{display:none}
}

/* ===================== APP (inbox) — pass de marque Sorva ===================== */
body.task-mail, body.task-addressbook, body.task-settings, .ui{ font-family:var(--sans)!important; }
/* accent cuivre sur les boutons primaires + sélections */
.ui .btn-primary, .pretty-select .btn-primary, #layout .btn-primary{
  background-color:var(--cuivre)!important; border-color:var(--cuivre)!important; color:#fff!important;
}
.ui .btn-primary:hover{background-color:var(--cuivre-clair)!important}
/* logo / barre d'app : teinte encre */
#layout-menu, .menu, #taskmenu, .toolbar{background-color:var(--encre)!important}
#taskmenu a, #layout-menu a{color:#cfc9bb!important}
#taskmenu a.selected, #taskmenu a:hover{color:var(--cuivre-clair)!important}
/* listes : message non lu en gras + accent sélection cuivre */
.messagelist tr.selected td, .listing li.selected, .listing tr.selected{
  background-color:rgba(185,144,91,.12)!important; box-shadow:inset 3px 0 0 var(--cuivre)!important;
}
a, .ui a{color:#8a6a3e}
/* logo header -> rose des vents Sorva */
img#logo, #logo{content:url('../images/logo.svg')!important; height:30px!important; width:auto!important; max-width:150px}
/* dossier sélectionné en cuivre (au lieu du bleu elastic) */
.folderlist li.selected>a, #mailboxlist li.selected>a, .listing li.selected,
.messagelist tr.selected td{ box-shadow:inset 3px 0 0 var(--cuivre)!important; background-color:rgba(185,144,91,.12)!important }
.folderlist li.selected>a, #mailboxlist li.selected>a{ color:var(--encre)!important; font-weight:600 }
.unreadcount, .countcol .count, .badge{ background-color:var(--cuivre)!important; color:#fff!important }

/* ===== Premium Sorva : typographie + finitions ===== */
body, .ui, input, button, select, textarea, .messagelist, .messagelist td, .listing,
.listing td, .menu, .toolbar, #messagelist, .contentframe, .boxtitle, .propform, .formcontent {
  font-family:'Inter','Noto Sans SC',-apple-system,system-ui,sans-serif !important;
}
/* sujets / en-têtes en serif éditorial */
.messageheader .subject, #messageheader .subject, .subject .text-cut, h2.boxtitle, .menu .listing .name {
  font-family:'Cormorant Garamond',Georgia,serif !important; letter-spacing:-.005em;
}
.messageheader .subject, #messageheader .subject { font-size:22px !important; font-weight:600 !important; color:var(--encre) !important; }
/* non-lu : sujet en gras encre, accent cuivre */
.messagelist tr.unread td.subject, .messagelist tr.unread span.subject { font-weight:600 !important; color:var(--encre) !important; }
/* scrollbars cuivre discrètes */
*::-webkit-scrollbar{ width:9px; height:9px }
*::-webkit-scrollbar-thumb{ background:rgba(185,144,91,.4); border-radius:6px }
*::-webkit-scrollbar-track{ background:transparent }
/* boutons primaires : encre profond, accent cuivre au survol */
.btn-primary, .button.btn-primary, button.primary { background-color:var(--cuivre) !important; border-color:var(--cuivre) !important; }
.btn-primary:hover{ background-color:var(--cuivre-clair) !important }
/* liste de messages : fond crème chaud, lignes douces, survol cuivre */
#messagelist, .messagelist, .messagelist tbody, .listing{ background-color:#faf6ee !important }
.messagelist tbody tr{ border-bottom:1px solid rgba(231,221,199,.65) !important }
.messagelist tbody tr:hover{ background-color:rgba(185,144,91,.07) !important }
.messagelist tr td.subject{ letter-spacing:-.003em }
/* en-tête de message lu : fond crème, filet cuivre */
.messageheader, #messageheader{ background-color:#faf6ee !important; border-bottom:1px solid var(--bordure) !important }
/* barre d'outils : crème */
.toolbar, #messagetoolbar, .menu.toolbar{ background-color:var(--creme) !important }