/*
 * Actions des lignes de présence mobile — composant transversal canonique.
 * Couvre les actions génériques Présent / Absent excusé / Absent payant / suppression
 * et les emplacements vides. Les actions spécialisées Pointage (state-icon-only,
 * mobile-reset-state, mobile-dropin-delete) restent dans pointage-mobile.css.
 */

@media (max-width:1050px){
  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only),
  .empty-slot{
    width:100%;
    min-width:0;
    height:70px;
    min-height:70px;
    border-radius:13px;
  }

  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only){
    border:1px solid transparent;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    font-weight:800;
    font-size:12px;
    line-height:1.05;
    text-align:center;
    padding:5px 4px;
    cursor:pointer;
  }

  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only) .ico{
    width:23px;
    height:23px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:16px;
    font-weight:900;
  }

  .action.present{background:var(--green-soft);color:var(--green-text);border-color:#b8d1b8;}
  .action.present:not(.state-icon-only) .ico{background:#3d7d45;color:#fff;}
  .action.present.selected{background:var(--green-strong);color:#fff;border-color:#568c5c;}

  .action.excused{background:var(--orange-soft);color:var(--orange-text);border-color:#e7c98f;}
  .action.excused:not(.state-icon-only) .ico{background:#bd7a0a;color:#fff;}
  .action.excused.selected{background:var(--orange-strong);color:#fff;border-color:#b97d22;}

  .action.paid{background:var(--red-soft);color:var(--red-text);border-color:#ddb2b2;}
  .action.paid:not(.state-icon-only) .ico{background:#9d3434;color:#fff;}
  .action.paid.selected{background:var(--red-strong);color:#fff;border-color:#aa4d4d;}

  .action.delete{
    background:#fff1f1;
    border-color:#d88a8a;
    color:#9b3d3d;
    display:grid;
    grid-template-rows:32px auto;
    place-content:center;
    place-items:center;
    gap:5px;
  }
  .action.delete .ico.trash{
    display:block;
    grid-row:1;
    flex:none;
    margin:0;
    top:auto;
    width:32px;
    height:32px;
    border:0;
    background:none;
    border-radius:0;
    align-self:center;
  }
  .action.delete .ico.trash::before,
  .action.delete .ico.trash::after{display:none;}
  .action.delete .ico.trash svg{
    display:block;
    width:32px;
    height:32px;
    fill:none;
    stroke:#b34b4b;
    stroke-width:1.55;
    stroke-linecap:round;
    stroke-linejoin:round;
  }
  .action.delete > span:last-child{
    grid-row:2;
    line-height:1;
    margin:0;
  }
  .action.delete:active{background:#c96d6d;color:#fff;border-color:#aa4d4d;}

  .empty-slot{background:transparent;border:1px solid transparent;}
}

@media (max-width:700px){
  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only),
  .empty-slot{
    height:64px;
    min-height:64px;
  }

  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only){
    font-size:11.5px;
    padding:4px 3px;
    gap:3px;
  }

  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only) .ico{
    width:21px;
    height:21px;
    font-size:15px;
  }
}

@media (max-width:480px){
  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only),
  .empty-slot{
    width:65px;
    min-width:65px;
    max-width:65px;
    height:66px;
    min-height:66px;
    max-height:66px;
    border-radius:12px;
  }

  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only){
    padding:4px 2px;
    gap:3px;
    font-size:10.5px;
    line-height:1.02;
  }

  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only) .ico{
    width:20px;
    height:20px;
    font-size:14px;
  }
}

@media (max-width:400px){
  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only),
  .empty-slot{
    width:60px;
    min-width:60px;
    max-width:60px;
    height:62px;
    min-height:62px;
    max-height:62px;
  }

  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only){font-size:10px;}
}

/* Variante tablette héritée du rendu actuel. */
@media (min-width:900px) and (max-width:1050px){
  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only),
  .empty-slot,
  .lists-grid .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only),
  .lists-grid .empty-slot{
    width:100%;
    min-width:0;
    max-width:none;
    height:38px;
    min-height:38px;
    max-height:none;
    padding:2px 5px;
    border-radius:6px;
  }

  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only),
  .lists-grid .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only){
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:center;
    gap:4px;
    font-size:10px;
    line-height:1;
  }

  .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only) .ico,
  .lists-grid .action:not(.mobile-dropin-delete):not(.mobile-reset-state):not(.state-icon-only) .ico{
    width:17px;
    height:17px;
    min-width:17px;
    font-size:12px;
    margin:0;
  }

  .action.delete,
  .lists-grid .action.delete{
    display:flex;
    grid-template-rows:none;
    flex-direction:row;
    gap:4px;
  }

  .action.delete .ico.trash,
  .lists-grid .action.delete .ico.trash{
    width:17px;
    height:17px;
  }
}

/* Suppression générique mobile — source transverse unique. */
@media (max-width:1050px){
  .action.delete-cross{
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff1f1;
    border-color:#d88a8a;
    color:#b13e3e;
  }
  .action.delete-cross svg{
    width:32px;
    height:32px;
    fill:none;
    stroke:currentColor;
    stroke-width:2.4;
    stroke-linecap:round;
  }
}
