/*
Theme Name:   COM MANIA
Theme URI:    https://com-mania.example/
Author:       COM MANIA
Description:  Thème WordPress dédié au nouveau site COM MANIA — structure minimale (Accueil avec connexion intégrée, Pointage, Congés), couleurs de marque (violet), et un modèle de page en pleine largeur, sans menu ni sidebar parasite, pour accueillir proprement les écrans du plugin com-mania-rh (connexion, pointage, congés, validation...).
Version:      1.2.0
Requires at least: 6.0
Requires PHP: 7.4
License:      GPLv2 or later
Text Domain:  com-mania-theme
*/

/* ------------------------------------------------------------------
   Palette de marque — estimation visuelle depuis com-mania.tn
   (bandeau violet/mauve). À ajuster si vous avez les codes exacts :
   remplacez simplement les valeurs ci-dessous, tout le thème et
   les écrans RH (voir public/css/app.css du plugin) en dépendent.
   ------------------------------------------------------------------ */
:root {
  --brand-primary:       #6B4E8E; /* violet principal — boutons, liens, accents */
  --brand-primary-dark:  #4A3563; /* violet foncé — en-tête, pied de page */
  --brand-primary-darker:#372850; /* survol sur fond foncé */
  --brand-accent-light:  #F2EDF8; /* fond clair teinté */
  --brand-text:          #2B2333; /* texte principal */
  --brand-text-mute:     #6b7280;
  --brand-border:        #E4DCEF;
  --brand-white:         #ffffff;
}

/* ------------------------------------------------------------------
   Reset léger
   ------------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: var(--brand-text);
  background: var(--brand-white);
  line-height: 1.6;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--brand-primary); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { color: var(--brand-primary-dark); line-height: 1.25; margin: 0 0 .6em; }
p { margin: 0 0 1em; }
.screen-reader-text {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(1px,1px,1px,1px); white-space: nowrap;
}

/* ------------------------------------------------------------------
   Conteneur
   ------------------------------------------------------------------ */
.site-container { max-width: 1140px; margin: 0 auto; padding: 0 24px; }

/* ------------------------------------------------------------------
   En-tête
   ------------------------------------------------------------------ */
.site-header {
  background: var(--brand-primary-dark);
  color: var(--brand-white);
  position: sticky; top: 0; z-index: 50;
}
.site-header-inner {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 24px; max-width: 1140px; margin: 0 auto;
}
.site-branding { display: flex; align-items: center; gap: 12px; }
.site-branding a { color: var(--brand-white); text-decoration: none; }
.site-branding .custom-logo { max-height: 44px; width: auto; display: block; }
.site-title {
  font-size: 20px; font-weight: 700; letter-spacing: .02em; margin: 0;
}
.site-title a:hover { text-decoration: none; opacity: .9; }

.primary-menu-toggle {
  display: none; background: none; border: 1px solid rgba(255,255,255,.4);
  border-radius: 6px; color: var(--brand-white); font-size: 22px;
  padding: 4px 10px; cursor: pointer;
}

.primary-menu { list-style: none; display: flex; gap: 6px; margin: 0; padding: 0; }
.primary-menu li { position: relative; }
.primary-menu a {
  display: block; color: var(--brand-white); text-decoration: none;
  font-size: 14.5px; font-weight: 600; padding: 10px 14px; border-radius: 6px;
  transition: background .15s ease;
}
.primary-menu a:hover,
.primary-menu .current-menu-item > a {
  background: var(--brand-primary-darker);
}

.site-account {
  display: flex; align-items: center; gap: 10px;
  margin-left: 14px; padding-left: 14px;
  border-left: 1px solid rgba(255,255,255,.25);
  font-size: 13.5px; color: rgba(255,255,255,.85);
  white-space: nowrap;
}
.site-account-logout {
  color: var(--brand-white); font-weight: 600;
  padding: 6px 10px; border-radius: 6px; border: 1px solid rgba(255,255,255,.35);
}
.site-account-logout:hover { background: var(--brand-primary-darker); text-decoration: none; }

/* ------------------------------------------------------------------
   Contenu générique (page.php, index.php, 404.php)
   ------------------------------------------------------------------ */
.site-main { min-height: 50vh; }
.page-header-band {
  background: var(--brand-accent-light);
  border-bottom: 1px solid var(--brand-border);
  padding: 40px 0;
  margin-bottom: 40px;
}
.page-header-band h1 { margin: 0; font-size: 30px; }
.entry-content { padding-bottom: 60px; font-size: 16px; }
.entry-content > *:first-child { margin-top: 0; }

.entry-content .wp-block-button__link,
.entry-content a.button {
  display: inline-block; background: var(--brand-primary); color: var(--brand-white);
  padding: 11px 22px; border-radius: 8px; font-weight: 600; text-decoration: none;
}
.entry-content .wp-block-button__link:hover,
.entry-content a.button:hover { background: var(--brand-primary-darker); text-decoration: none; }

/* ------------------------------------------------------------------
   Page d'accueil (front-page.php)
   ------------------------------------------------------------------ */
.hero {
  background: linear-gradient(135deg, var(--brand-primary-dark), var(--brand-primary));
  color: var(--brand-white);
  padding: 80px 0;
  text-align: center;
}
.hero h1 { color: var(--brand-white); font-size: 38px; margin-bottom: 14px; }
.hero .hero-subtitle { font-size: 18px; opacity: .92; max-width: 640px; margin: 0 auto 30px; }
.hero .hero-cta {
  display: inline-block; background: var(--brand-white); color: var(--brand-primary-dark);
  padding: 13px 28px; border-radius: 8px; font-weight: 700; text-decoration: none; font-size: 15.5px;
}
.hero .hero-cta:hover { background: var(--brand-accent-light); text-decoration: none; }

.home-content { padding: 60px 0; }

/* ------------------------------------------------------------------
   Modèle « Espace RH » — pleine largeur, sans distraction, pensé
   pour accueillir les shortcodes du plugin com-mania-rh.
   ------------------------------------------------------------------ */
.rh-page-header {
  background: var(--brand-accent-light);
  padding: 30px 0;
  border-bottom: 1px solid var(--brand-border);
  margin-bottom: 30px;
}
.rh-page-header h1 { margin: 0; font-size: 26px; }
.rh-page-content { max-width: 1140px; margin: 0 auto; padding: 0 24px 60px; }

/* ------------------------------------------------------------------
   Pied de page
   ------------------------------------------------------------------ */
.site-footer {
  background: var(--brand-primary-darker);
  color: rgba(255,255,255,.85);
  padding: 30px 0;
  margin-top: 60px;
  font-size: 13.5px;
  text-align: center;
}
.site-footer a { color: var(--brand-white); }

/* ------------------------------------------------------------------
   Responsive
   ------------------------------------------------------------------ */
@media (max-width: 780px) {
  .primary-menu-toggle { display: inline-block; }
  .primary-menu {
    display: none; flex-direction: column; gap: 0;
    position: absolute; top: 100%; left: 0; right: 0;
    background: var(--brand-primary-dark); padding: 8px 16px 16px;
  }
  .primary-menu.is-open { display: flex; }
  .primary-menu a { padding: 12px 8px; border-bottom: 1px solid rgba(255,255,255,.1); }
  .hero { padding: 56px 0; }
  .hero h1 { font-size: 28px; }
  .site-account { margin-left: 8px; padding-left: 8px; }
  .site-account-name { display: none; }
}

/* ------------------------------------------------------------------
   Connexion WordPress (wp-login.php) — voir functions.php
   ------------------------------------------------------------------ */
.login h1 a {
  background-size: contain !important;
  width: 100% !important;
  height: 70px !important;
}
body.login { background: var(--brand-accent-light); }
.login form { border-radius: 10px; border: 1px solid var(--brand-border); box-shadow: none; }
.login .button-primary {
  background: var(--brand-primary); border-color: var(--brand-primary-darker);
  box-shadow: none; text-shadow: none;
}
.login .button-primary:hover,
.login .button-primary:focus { background: var(--brand-primary-darker); border-color: var(--brand-primary-darker); }
.login #backtoblog a, .login #nav a { color: var(--brand-primary-dark); }