/* Extracted from index.html <style id="rabbit-profile-design-v5"> */

/* =========================================================
   Rabbit Profile Design V5
   Allinea la pagina Profilo al design moderno della Home.
   Solo CSS: nessuna funzione modificata.
   ========================================================= */

/* Scope ampio ma difensivo: colpisce il profilo senza rompere la Home */
#profile,
#settings\/profilo,
.view#profile,
.view[id*="profilo"],
.view[id*="profile"]{
  background:
    radial-gradient(circle at 8% 0%, rgba(21,94,239,.10), transparent 28%),
    radial-gradient(circle at 94% 4%, rgba(14,124,114,.12), transparent 24%),
    linear-gradient(180deg, rgba(244,247,251,.64), rgba(234,241,251,.72)) !important;
  min-height:100vh;
}

/* Hero profilo */
.profile-hero,
.profile-header,
.operational-profile-hero,
#profile .hero,
#profile .profile-top,
#profile [class*="profile"][class*="hero"],
.view[id*="profilo"] .profile-hero,
.view[id*="profile"] .profile-hero{
  border-radius:30px !important;
  border:1px solid rgba(255,255,255,.76) !important;
  background:
    radial-gradient(circle at 88% 12%, rgba(14,124,114,.34), transparent 28%),
    radial-gradient(circle at 20% 0%, rgba(21,94,239,.18), transparent 26%),
    linear-gradient(135deg, #0f2f45 0%, #0e4f52 54%, #0e7c72 100%) !important;
  box-shadow:0 24px 70px rgba(16,24,40,.16) !important;
  overflow:hidden !important;
  position:relative !important;
  padding:28px !important;
  color:#fff !important;
}

.profile-hero::after,
.profile-header::after,
.operational-profile-hero::after,
#profile .profile-top::after,
.view[id*="profilo"] .profile-hero::after,
.view[id*="profile"] .profile-hero::after{
  content:"IDENTITÀ OPERATIVA";
  position:absolute;
  right:24px;
  bottom:-16px;
  font-size:72px;
  line-height:1;
  letter-spacing:-.08em;
  font-weight:950;
  color:rgba(255,255,255,.07);
  pointer-events:none;
}

/* Avatar/foto */
#profile img,
.view[id*="profilo"] img,
.view[id*="profile"] img{
  border-radius:22px !important;
  border:3px solid rgba(255,255,255,.72) !important;
  box-shadow:0 16px 38px rgba(2,6,23,.22) !important;
  object-fit:cover !important;
}

/* Titoli profilo */
#profile h1,
#profile h2,
.view[id*="profilo"] h1,
.view[id*="profile"] h1,
.view[id*="profilo"] h2,
.view[id*="profile"] h2{
  letter-spacing:-.055em !important;
  color:#10203d;
}

.profile-hero h1,
.profile-header h1,
.operational-profile-hero h1,
#profile .profile-top h1,
.view[id*="profilo"] .profile-hero h1,
.view[id*="profile"] .profile-hero h1,
.profile-hero h2,
.profile-header h2,
.operational-profile-hero h2{
  color:#fff !important;
  text-shadow:0 2px 18px rgba(2,6,23,.20);
}

/* Badge e pill */
#profile .badge,
#profile .pill,
#profile .status,
.view[id*="profilo"] .badge,
.view[id*="profile"] .badge,
.view[id*="profilo"] .pill,
.view[id*="profile"] .pill{
  border-radius:999px !important;
  border:1px solid rgba(255,255,255,.22) !important;
  background:rgba(255,255,255,.14) !important;
  backdrop-filter:blur(14px) !important;
  color:inherit;
}

/* KPI sotto hero */
#profile .kpi,
#profile .metric,
#profile .stat,
#profile .summary-card,
.view[id*="profilo"] .kpi,
.view[id*="profile"] .kpi,
.view[id*="profilo"] .metric,
.view[id*="profile"] .metric,
.view[id*="profilo"] .stat,
.view[id*="profile"] .stat{
  border-radius:0 !important;
  border:0 !important;
  background:rgba(255,255,255,.18) !important;
  color:#fff !important;
  box-shadow:none !important;
}

#profile .kpi b,
#profile .metric b,
#profile .stat b,
.view[id*="profilo"] .kpi b,
.view[id*="profile"] .kpi b{
  color:#fff !important;
}

/* Card sezioni profilo */
#profile .card,
#profile .panel,
#profile .section,
#profile .profile-card,
#profile .profile-panel,
.view[id*="profilo"] .card,
.view[id*="profile"] .card,
.view[id*="profilo"] .panel,
.view[id*="profile"] .panel,
.view[id*="profilo"] .section,
.view[id*="profile"] .section{
  border-radius:24px !important;
  border:1px solid rgba(255,255,255,.74) !important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.94),rgba(248,251,255,.86)) !important;
  box-shadow:0 14px 38px rgba(16,24,40,.08) !important;
  backdrop-filter:blur(18px) !important;
  -webkit-backdrop-filter:blur(18px) !important;
  overflow:hidden;
}

/* Sezioni grandi: stato personale, identità, mansioni, obiettivi */
#profile [class*="personal"],
#profile [class*="identity"],
#profile [class*="support"],
#profile [class*="goal"],
#profile [class*="objective"],
#profile [class*="mansioni"],
#profile [class*="agenda"],
.view[id*="profilo"] [class*="personal"],
.view[id*="profile"] [class*="personal"],
.view[id*="profilo"] [class*="identity"],
.view[id*="profile"] [class*="identity"],
.view[id*="profilo"] [class*="support"],
.view[id*="profile"] [class*="support"],
.view[id*="profilo"] [class*="goal"],
.view[id*="profile"] [class*="goal"]{
  border-radius:24px;
}

/* Griglie interne più ariose */
#profile .grid,
#profile .profile-grid,
#profile .two-col,
#profile .columns,
.view[id*="profilo"] .grid,
.view[id*="profile"] .grid,
.view[id*="profilo"] .profile-grid,
.view[id*="profile"] .profile-grid{
  gap:16px !important;
}

/* Elementi riga/mini-card */
#profile .row,
#profile .item,
#profile .tile,
#profile .goal,
#profile .task,
#profile .identity-card,
.view[id*="profilo"] .row,
.view[id*="profile"] .row,
.view[id*="profilo"] .item,
.view[id*="profile"] .item,
.view[id*="profilo"] .tile,
.view[id*="profile"] .tile,
.view[id*="profilo"] .goal,
.view[id*="profile"] .goal{
  border-radius:18px !important;
  border:1px solid rgba(16,24,40,.08) !important;
  background:linear-gradient(180deg,#fff,#f9fbff) !important;
  box-shadow:0 8px 22px rgba(16,24,40,.04) !important;
}

/* Stato personale come bottoni/presenza più belli */
#profile button,
.view[id*="profilo"] button,
.view[id*="profile"] button{
  border-radius:15px !important;
}

#profile button:hover,
.view[id*="profilo"] button:hover,
.view[id*="profile"] button:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 22px rgba(16,24,40,.08) !important;
}

#profile button.primary,
.view[id*="profilo"] button.primary,
.view[id*="profile"] button.primary{
  background:linear-gradient(135deg,#155eef,#1d4ed8) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 12px 28px rgba(21,94,239,.22) !important;
}

/* Tabelline / blocchi identità */
#profile dl,
#profile .identity-grid,
.view[id*="profilo"] dl,
.view[id*="profile"] dl,
.view[id*="profilo"] .identity-grid,
.view[id*="profile"] .identity-grid{
  gap:10px !important;
}

#profile dt,
#profile label,
.view[id*="profilo"] dt,
.view[id*="profile"] dt,
.view[id*="profilo"] label,
.view[id*="profile"] label{
  color:#667085 !important;
  font-weight:800 !important;
  letter-spacing:.02em;
}

#profile dd,
.view[id*="profilo"] dd,
.view[id*="profile"] dd{
  color:#101828 !important;
  font-weight:850 !important;
}

/* Progress bar obiettivi */
#profile progress,
#profile .progress,
#profile .progress-bar,
.view[id*="profilo"] progress,
.view[id*="profile"] progress,
.view[id*="profilo"] .progress,
.view[id*="profile"] .progress{
  border-radius:999px !important;
  overflow:hidden !important;
}

#profile .progress > *,
#profile .bar,
#profile .progress-fill,
.view[id*="profilo"] .progress > *,
.view[id*="profile"] .progress > *,
.view[id*="profilo"] .bar,
.view[id*="profile"] .bar,
.view[id*="profilo"] .progress-fill,
.view[id*="profile"] .progress-fill{
  background:linear-gradient(90deg,#0e7c72,#155eef) !important;
  border-radius:999px !important;
}

/* Tag competenze */
#profile .tag,
#profile .chip,
.view[id*="profilo"] .tag,
.view[id*="profile"] .tag,
.view[id*="profilo"] .chip,
.view[id*="profile"] .chip{
  border-radius:999px !important;
  background:#eaf6fb !important;
  color:#0f4c5c !important;
  border:1px solid rgba(14,124,114,.12) !important;
  font-weight:850 !important;
}

/* Bottoni hero destra */
.profile-hero button,
.profile-header button,
.operational-profile-hero button,
#profile .profile-top button,
.view[id*="profilo"] .profile-hero button,
.view[id*="profile"] .profile-hero button{
  border-radius:16px !important;
  border:1px solid rgba(255,255,255,.26) !important;
  background:rgba(255,255,255,.92) !important;
  color:#10203d !important;
  box-shadow:0 12px 30px rgba(2,6,23,.18) !important;
}

.profile-hero button.primary,
.profile-header button.primary,
.operational-profile-hero button.primary,
#profile .profile-top button.primary{
  background:linear-gradient(135deg,#155eef,#1d4ed8) !important;
  color:#fff !important;
  border-color:transparent !important;
}

/* Riduzione delle aree bianche enormi: se la pagina profilo usa min-height eccessivi */
#profile .empty,
.view[id*="profilo"] .empty,
.view[id*="profile"] .empty{
  min-height:0 !important;
  border-radius:20px !important;
  background:rgba(255,255,255,.62) !important;
}

/* Responsive profilo */
@media(max-width:980px){
  .profile-hero,
  .profile-header,
  .operational-profile-hero,
  #profile .profile-top,
  .view[id*="profilo"] .profile-hero,
  .view[id*="profile"] .profile-hero{
    padding:22px !important;
    border-radius:24px !important;
  }

  .profile-hero::after,
  .profile-header::after,
  .operational-profile-hero::after,
  #profile .profile-top::after{
    font-size:42px;
    right:12px;
  }

  #profile .grid,
  #profile .profile-grid,
  .view[id*="profilo"] .grid,
  .view[id*="profile"] .grid{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:640px){
  #profile,
  .view[id*="profilo"],
  .view[id*="profile"]{
    padding:10px !important;
  }

  .profile-hero,
  .profile-header,
  .operational-profile-hero,
  #profile .profile-top{
    padding:18px !important;
  }

  .profile-hero::after,
  .profile-header::after,
  .operational-profile-hero::after,
  #profile .profile-top::after{
    display:none;
  }
}