/* =========================================================
   Reordenar mòduls del dashboard
   ========================================================= */

/* La barra sencera (no només la fletxa) plega/desplega el mòdul, i una
   línia fina de sota la delimita clarament — abans la fletxa quedava
   "flotant" lluny del títol i no es veia a quin mòdul pertanyia. */
.bloc-cap{cursor:pointer;padding:14px 20px;margin-bottom:14px;border-radius:10px;border-bottom:1px solid var(--linia);transition:background .12s}
@media(max-width:640px){.bloc-cap{padding:12px 14px}}
.bloc-cap:hover{background:#fafbfa}
/* Els controls de dins (nansa, fletxes de moure, botons d'acció) han de
   recuperar el seu propi cursor — si no, semblaria que tot és "plegar". */
.bloc-cap button, .bloc-cap a{cursor:pointer}

.mod-handle{cursor:grab;color:var(--gris-clar);font-size:13px;line-height:1;padding:4px 2px;flex-shrink:0;align-self:center;letter-spacing:-2px;user-select:none}
.mod-handle:hover{color:var(--gris)}
.mod-handle:active{cursor:grabbing}

/* Fletxes amunt/avall per a mòbil/tàctil, en lloc d'arrossegar (el
   drag-and-drop natiu no és fiable amb el dit i es queda "penjat"). */
.mod-moure{display:flex;gap:2px;flex-shrink:0;align-self:center}
.mod-fletxa{width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--gris-clar);border-radius:6px}
.mod-fletxa:hover, .mod-fletxa:active{color:var(--gris);background:#eef1f0}

.mod-toggle{align-self:center;width:28px;height:28px;border-radius:8px;font-size:13px;color:var(--gris);flex-shrink:0;border:1px solid var(--linia-forta);background:#fbfcfb}
.mod-toggle:hover{background:#f2f4f3;color:var(--tinta);border-color:var(--linia-forta)}

/* Quan el grup d'accions només porta el botó de plegar (la majoria de
   mòduls), en mòbil ha de quedar-se petit i a la dreta de tot — no
   ocupar tota l'amplada com fan els grups amb botons de veritat
   (regla venia d'un altre fitxer, persones-page.css, pensada per a
   botons reals, no per a aquest toggle petit). */
@media(max-width:640px){
  .bloc-cap-accions.mod-accions-sol{width:auto;margin-left:auto;flex-wrap:nowrap}

  /* Un mòdul plegat amb botons de veritat (Periòdiques, El meu dia...)
     només ensenya el toggle — però la regla de mòbil de dalt (pensada
     per quan SÍ hi ha botons visibles a amplada completa) el deixava
     penjat sol a l'esquerra en una línia pròpia. Un cop plegat, ha de
     tornar a comportar-se com si fos "mod-accions-sol": petit i a la
     dreta, sigui quin sigui el mòdul. */
  section.blocs.mod-colapsat .bloc-cap-accions{width:auto;margin-left:auto;flex-wrap:nowrap}
}

section.blocs.mod-colapsat > *:not(.bloc-cap){display:none}
section.blocs.mod-colapsat .bloc-cap{margin-bottom:0}

/* En col·lapsar un mòdul, la barra només ha de portar la nansa, el
   títol i el botó de plegar — qualsevol altre botó d'acció de la
   capçalera (Periòdiques, El meu dia, Veure de tot l'equip...) no té
   sentit sense el contingut a sota, així que s'amaga sol quan el
   mòdul es plega, sigui quin sigui el mòdul. */
section.blocs.mod-colapsat .bloc-cap-accions > *:not(.mod-toggle){display:none}

section.blocs.mod-arrossegant{opacity:.4}
section.blocs.mod-abans-linia{box-shadow:0 -3px 0 0 var(--verd-fort)}
