/* Tema corporativo "Corporativo Azul" – Chamilo 1.11.x – marca blanca
   PERSONALIZAR LA EMPRESA: cambie SOLO las variables de este bloque. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Montserrat:wght@600;700&display=swap');
:root{
  --marca:#0b5cff;          /* color principal de la empresa */
  --marca-oscuro:#0742b8;     /* variante oscura (hover) */
  --acento:#00a3a3;        /* color secundario / insignias */
  --cabecera:#ffffff;         /* fondo de la cabecera */
  --cabecera-texto:#374151;  /* texto del menú */
  --fondo:#f5f7fb;
  --texto:#1f2937;--gris:#6b7280;--borde:#e5e7eb;
  --radio:10px;
  --logo-alto:52px;           /* tamaño del logo */
  --logo-margen:8px 0;
}
body{background:var(--fondo);color:var(--texto);font-family:'Inter',Arial,sans-serif;font-size:15px}
h1,h2,h3,h4,.page-header h2,.panel-title{font-family:'Montserrat','Inter',sans-serif;font-weight:700;color:#111827;letter-spacing:-.2px}
a{color:var(--marca)}a:hover,a:focus{color:var(--marca-oscuro);text-decoration:none}
/* Cabecera y logo */
#header,.header{background:var(--cabecera);box-shadow:0 1px 0 var(--borde)}
#header .logo,#logo,.navbar-brand{padding:var(--logo-margen)}
#header .logo img,#logo img,.navbar-brand img{height:var(--logo-alto);width:auto;max-height:none}
.navbar-default{background:var(--cabecera);border:0;border-radius:0;border-bottom:1px solid var(--borde);margin-bottom:0;box-shadow:0 2px 8px rgba(17,24,39,.04)}
.navbar-default .navbar-nav>li>a{color:var(--cabecera-texto);font-weight:500;font-size:14px}
.navbar-default .navbar-nav>li>a:hover,.navbar-default .navbar-nav>.active>a,.navbar-default .navbar-nav>.active>a:hover,.navbar-default .navbar-nav>.open>a{background:transparent;color:var(--marca);box-shadow:inset 0 -3px 0 var(--marca)}
.dropdown-menu{border:1px solid var(--borde);border-radius:var(--radio);box-shadow:0 12px 30px rgba(17,24,39,.12);padding:6px}
.dropdown-menu>li>a{border-radius:6px}.dropdown-menu>li>a:hover{background:var(--fondo);color:var(--marca)}
/* Portada y catálogo de cursos */
.jumbotron,.announcements{background:linear-gradient(120deg,var(--marca),var(--marca-oscuro));color:#fff;border-radius:var(--radio)}
.jumbotron h1,.jumbotron h2{color:#fff}
.page-header{border-bottom:1px solid var(--borde)}
.breadcrumb{background:transparent;padding:10px 0;font-size:13px}.breadcrumb>.active{color:var(--marca)}
.panel,.panel-default,.well{background:#fff;border:1px solid var(--borde);border-radius:var(--radio);box-shadow:0 1px 3px rgba(17,24,39,.06)}
.panel-default>.panel-heading{background:#fff;border-bottom:1px solid var(--borde);border-radius:var(--radio) var(--radio) 0 0;font-weight:600}
.items-course,.course-item,.thumbnail,.grid-courses .items{background:#fff;border:1px solid var(--borde);border-radius:var(--radio);overflow:hidden;transition:transform .2s,box-shadow .2s}
.items-course:hover,.course-item:hover,.thumbnail:hover,.grid-courses .items:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(17,24,39,.12);border-color:transparent}
.items-course .image img,.thumbnail img{width:100%;object-fit:cover}
.items-course .category,.course-category{background:var(--acento);color:#fff;border-radius:999px;padding:2px 10px;font-size:11px;font-weight:600}
.progress{border-radius:999px;background:#eef0f3;height:8px}.progress-bar{background:var(--marca)}
/* Botones */
.btn{border-radius:8px;font-weight:600;padding:8px 16px}
.btn-primary,.btn-success{background:var(--marca);border-color:var(--marca);color:#fff}
.btn-primary:hover,.btn-primary:focus,.btn-success:hover{background:var(--marca-oscuro);border-color:var(--marca-oscuro)}
.btn-default{background:#fff;border-color:var(--borde);color:var(--texto)}.btn-default:hover{border-color:var(--marca);color:var(--marca)}
.label-primary,.badge{background:var(--acento)}
/* Formularios y tablas */
.form-control{border-radius:8px;border-color:var(--borde)}
.form-control:focus{border-color:var(--marca);box-shadow:0 0 0 3px color-mix(in srgb,var(--marca) 20%,transparent)}
.table>thead>tr>th,.data_table th{background:#f9fafb;color:var(--gris);font-size:12px;text-transform:uppercase;letter-spacing:.5px;border-bottom:2px solid var(--borde)}
.nav-tabs>li.active>a{border-top:3px solid var(--marca);color:var(--marca)}
.pagination>.active>a{background:var(--marca);border-color:var(--marca)}
/* Pie */
footer,#footer,.footer{background:#111827;color:#9ca3af;padding:28px 0;margin-top:40px;border-top:4px solid var(--marca)}
footer a,#footer a{color:#fff}
@media(max-width:768px){:root{--logo-alto:40px}}

/* Ocultar el aviso publicitario de chamilo.org en Administración */
#chamilo-news{display:none !important}

/* ===== BLOQUES LATERALES (Perfil, Cursos, Competencias) – tarjetas redondeadas y opciones como botones con ícono =====
   Estructura real de Chamilo 1.11: .sidebar .panel > .panel-body > ul.list-group > li.list-group-item > span.item-icon + a */
.sidebar .panel-group{margin-bottom:18px}
.sidebar .panel{border:1px solid var(--borde);border-radius:18px !important;overflow:hidden;box-shadow:0 4px 14px rgba(17,24,39,.06)}
.sidebar .panel-heading{background:linear-gradient(120deg,var(--marca),var(--marca-oscuro)) !important;border:0 !important;border-radius:0 !important;padding:14px 18px}
.sidebar .panel-heading,.sidebar .panel-heading a,.sidebar .panel-title,.sidebar .panel-title a{color:#fff !important;font-family:'Montserrat','Inter',sans-serif;font-weight:700;font-size:15px;text-decoration:none}
.sidebar .panel-body{padding:14px}
.sidebar .list-group{margin:0;padding:0}
.sidebar .list-group-item{position:relative;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--borde) !important;border-radius:12px !important;margin:0 0 8px;padding:9px 14px;transition:background .2s,border-color .2s,transform .15s,box-shadow .2s;cursor:pointer}
.sidebar .list-group-item:last-child{margin-bottom:0}
.sidebar .list-group-item .item-icon{flex:0 0 32px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--marca) 10%,#fff);border-radius:9px;transition:background .2s}
.sidebar .list-group-item .item-icon img{width:22px;height:22px;margin:0}
.sidebar .list-group-item>a{color:var(--texto);font-weight:500;font-size:14px;line-height:1.3;text-decoration:none}
.sidebar .list-group-item>a::after{content:"";position:absolute;inset:0;border-radius:12px} /* toda la tarjeta es clicable */
.sidebar .list-group-item:hover,.sidebar .list-group-item:focus-within,.sidebar .list-group-item.active{background:var(--marca);border-color:var(--marca) !important;transform:translateX(3px);box-shadow:0 6px 14px color-mix(in srgb,var(--marca) 30%,transparent)}
.sidebar .list-group-item:hover>a,.sidebar .list-group-item:focus-within>a,.sidebar .list-group-item.active>a{color:#fff}
.sidebar .list-group-item:hover .item-icon,.sidebar .list-group-item.active .item-icon{background:#fff}
/* Por si algún bloque usa el menú alternativo */
.sidebar .nav-pills.nav-stacked>li{margin:0 0 8px}
.sidebar .nav-pills.nav-stacked>li>a{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--borde);border-radius:12px;padding:9px 14px;color:var(--texto);font-weight:500}
.sidebar .nav-pills.nav-stacked>li>a:hover{background:var(--marca);border-color:var(--marca);color:#fff}
.sidebar #login-block .btn,.sidebar .btn{border-radius:12px}

/* ===== BORDE DORADO de los bloques laterales – cambie el color o el grosor aquí ===== */
:root{--dorado:#c9a227;--dorado-grosor:2px}
.sidebar .panel{border:var(--dorado-grosor) solid var(--dorado) !important;box-shadow:0 0 0 4px color-mix(in srgb,var(--dorado) 12%,transparent),0 6px 18px rgba(17,24,39,.08) !important}
.sidebar .panel-heading{border-bottom:var(--dorado-grosor) solid var(--dorado) !important}

/* ===== CORRECCION ICONOS: Chamilo (base.css) coloca .item-icon en posición absoluta fuera del botón; se integra dentro ===== */
.sidebar .list-group-item{margin-left:0 !important;padding:9px 12px !important}
.sidebar .list-group-item .item-icon{position:static !important;left:auto !important;margin:0 !important;text-align:center}

/* ===== CAJA DEL CONTENIDO PRINCIPAL de la portada (texto de la derecha) ===== */
#home-include,#home-welcome{background:#fff;border:var(--dorado-grosor) solid var(--dorado);border-radius:20px;padding:32px 36px;margin-bottom:24px;box-shadow:0 0 0 4px color-mix(in srgb,var(--dorado) 12%,transparent),0 8px 24px rgba(17,24,39,.07)}
#home-include h1,#home-include h2,#home-welcome h1,#home-welcome h2{margin-top:0}
#home-include ol,#home-include ul{padding-left:22px}
#home-include li{margin-bottom:8px;line-height:1.55}
#home-include p{line-height:1.6}
@media(max-width:768px){#home-include,#home-welcome{padding:20px}}

/* ===== BORDE GRIS DE LOS BOTONES laterales – más marcado (ajuste tono y grosor aquí) ===== */
:root{--boton-borde:#9ca3af;--boton-borde-grosor:1.5px}
.sidebar .list-group-item{border:var(--boton-borde-grosor) solid var(--boton-borde) !important}
.sidebar .list-group-item:hover,.sidebar .list-group-item:focus-within,.sidebar .list-group-item.active{border-color:var(--marca) !important}

/* ===== LINEAS DORADAS DEL MENU: arriba (debajo del logo) y abajo de las opciones ===== */
.navbar-default{border-top:var(--dorado-grosor) solid var(--dorado) !important;border-bottom:var(--dorado-grosor) solid var(--dorado) !important;box-shadow:0 2px 10px color-mix(in srgb,var(--dorado) 18%,transparent) !important}

/* ===== CAJA DE BIENVENIDA (Mis cursos) con borde dorado ===== */
#homepage-course{border:var(--dorado-grosor) solid var(--dorado);border-radius:18px !important;padding:24px 28px;margin-bottom:24px;line-height:1.65;font-size:15px;box-shadow:0 0 0 4px color-mix(in srgb,var(--dorado) 12%,transparent),0 8px 24px rgba(17,24,39,.10)}
#homepage-course a{color:#fff;text-decoration:underline}


/* ===== FOTO DEL MENU SUPERIOR DERECHO: círculo con borde dorado ===== */
.navbar .avatar-user>a>img.img-circle{border:2px solid var(--dorado) !important;padding:2px;background:#fff;box-shadow:0 0 0 3px color-mix(in srgb,var(--dorado) 20%,transparent);transition:box-shadow .2s}
.navbar .avatar-user>a:hover>img.img-circle,.navbar .avatar-user.open>a>img.img-circle{box-shadow:0 0 0 4px color-mix(in srgb,var(--dorado) 35%,transparent)}
.navbar .avatar-user .user-header img.img-circle{border:3px solid var(--dorado) !important;padding:3px;background:#fff}

/* ===== CAJA DE BIENVENIDA – PROPUESTA A: tarjeta blanca, ícono con aro dorado y línea dorada vertical ===== */
#homepage-course{position:relative;background:#fff !important;color:var(--texto) !important;border:var(--dorado-grosor) solid var(--dorado) !important;border-radius:18px !important;padding:24px 28px 24px 104px !important;line-height:1.7;font-size:15px;min-height:110px;box-shadow:0 0 0 4px color-mix(in srgb,var(--dorado) 12%,transparent),0 8px 24px rgba(17,24,39,.08) !important}
#homepage-course::before{content:"\f19d";font-family:FontAwesome;position:absolute;left:28px;top:24px;width:52px;height:52px;box-sizing:border-box;border-radius:50%;background:color-mix(in srgb,var(--marca) 10%,#fff);color:var(--marca);font-size:24px;display:flex;align-items:center;justify-content:center;border:2px solid var(--dorado)}
#homepage-course::after{content:"";position:absolute;left:53px;top:84px;bottom:28px;width:2px;border-radius:2px;background:linear-gradient(var(--dorado),color-mix(in srgb,var(--dorado) 35%,transparent))}
#homepage-course .normal-message::first-line{font-family:'Montserrat','Inter',sans-serif;font-weight:700;font-size:19px;color:var(--marca)}
#homepage-course a{color:var(--marca);text-decoration:underline}
#homepage-course .btn-primary{color:#fff;text-decoration:none;margin-top:12px}
@media(max-width:600px){#homepage-course{padding:84px 20px 20px !important}#homepage-course::after{display:none}}

/* ===== BARRA DE LA AGENDA: caja con línea azul y texto debajo de cada botón =====
   Separación entre botones: cambie --agenda-separacion (ej. 16px).
   Para cambiar un texto, edite el content:"..." de la línea correspondiente. */
#toolbar-agenda{border:2px solid var(--marca) !important;border-radius:14px !important;padding:12px 16px !important;background:#fff;box-shadow:0 4px 14px color-mix(in srgb,var(--marca) 12%,transparent)}
#toolbar-agenda>.row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 0}
#toolbar-agenda>.row>div:first-child{flex:1 1 auto;width:auto;display:flex;flex-wrap:wrap;gap:var(--agenda-separacion,16px)}
#toolbar-agenda>.row>div:last-child:not(:first-child){flex:0 1 auto;width:auto;margin-left:auto}
#toolbar-agenda>.row>div:first-child>a{display:inline-flex;flex-direction:column;align-items:center;justify-content:flex-start;width:96px;margin:0 !important;padding:8px 4px 7px;border:1.5px solid var(--boton-borde,#9ca3af);border-radius:12px;background:#fff;color:var(--texto);text-decoration:none;transition:background .2s,border-color .2s,transform .15s,box-shadow .2s}
#toolbar-agenda>.row>div:first-child>a img{border:0 !important;padding:0 !important;background:transparent !important;width:32px;height:32px}
#toolbar-agenda>.row>div:first-child>a::after{display:block;margin-top:5px;font-size:11.5px;font-weight:600;line-height:1.2;text-align:center;color:var(--texto)}
#toolbar-agenda>.row>div:first-child>a:hover{background:color-mix(in srgb,var(--marca) 8%,#fff);border-color:var(--marca);transform:translateY(-2px);box-shadow:0 6px 14px color-mix(in srgb,var(--marca) 20%,transparent)}
#toolbar-agenda>.row>div:first-child>a:hover::after{color:var(--marca)}
#toolbar-agenda a[href*="agenda_js.php"]::after{content:"Calendario"}
#toolbar-agenda a[href*="agenda_list.php"]::after{content:"Lista de agenda"}
#toolbar-agenda a[href*="action=add"]::after{content:"Añadir evento"}
#toolbar-agenda a[href*="action=importical"]::after{content:"Importar iCal"}
#toolbar-agenda a[href*="import_course_agenda_reminders"]::after{content:"Importar eventos"}
#toolbar-agenda a[href*="planification.php"]::after{content:"Planif. sesión"}
#toolbar-agenda a[href*="calendar_plan.php"]::after{content:"Horario estudiantes"}
:root{--agenda-separacion:16px}

/* ===== BARRA DE INFORMES: caja con línea azul y texto debajo de cada botón (mismo estilo que la Agenda) ===== */
.section-session_my_space #toolbar{border:2px solid var(--marca) !important;border-radius:14px !important;padding:12px 16px !important;background:#fff;box-shadow:0 4px 14px color-mix(in srgb,var(--marca) 12%,transparent)}
.section-session_my_space #toolbar>.row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 0}
.section-session_my_space #toolbar>.row>div{width:auto;display:flex;flex-wrap:wrap;gap:var(--agenda-separacion,16px);text-align:left}
.section-session_my_space #toolbar>.row>div:first-child{flex:1 1 auto}
.section-session_my_space #toolbar>.row>div:last-child:not(:first-child){flex:0 1 auto;margin-left:auto}
.section-session_my_space #toolbar>.row>div>a{display:inline-flex;flex-direction:column;align-items:center;justify-content:flex-start;width:96px;margin:0 !important;padding:8px 4px 7px;border:1.5px solid var(--boton-borde,#9ca3af);border-radius:12px;background:#fff;color:var(--texto);text-decoration:none;transition:background .2s,border-color .2s,transform .15s,box-shadow .2s}
.section-session_my_space #toolbar>.row>div>a img{border:0 !important;padding:0 !important;background:transparent !important;width:32px;height:32px}
.section-session_my_space #toolbar>.row>div>a::after{display:block;margin-top:5px;font-size:11.5px;font-weight:600;line-height:1.2;text-align:center;color:var(--texto)}
.section-session_my_space #toolbar>.row>div>a:hover{background:color-mix(in srgb,var(--marca) 8%,#fff);border-color:var(--marca);transform:translateY(-2px);box-shadow:0 6px 14px color-mix(in srgb,var(--marca) 20%,transparent)}
.section-session_my_space #toolbar>.row>div>a:hover::after{color:var(--marca)}
.section-session_my_space #toolbar a[href*="my_progress.php"]::after{content:"Mis estadísticas"}
.section-session_my_space #toolbar a[href*="certificate_report.php"]::after{content:"Certificados"}
.section-session_my_space #toolbar a[href=""]::after,.section-session_my_space #toolbar a[href*="view=teacher"]::after{content:"Interfaz profesor"}
.section-session_my_space #toolbar a[href*="admin_view.php"]::after{content:"Interfaz admin"}
.section-session_my_space #toolbar a[href*="tracking/exams.php"]::after{content:"Seguim. exámenes"}
.section-session_my_space #toolbar a[href*="current_courses.php"]::after{content:"Cursos actuales"}
.section-session_my_space #toolbar a[href*="session_filter.php"]::after{content:"Filtro certificados"}
.section-session_my_space #toolbar a[href*="learning_calendar"]::after{content:"Calendario"}
.section-session_my_space #toolbar a[href*="student.php"]::after{content:"Estudiantes"}
.section-session_my_space #toolbar a[href*="teachers.php"]::after{content:"Profesores"}
.section-session_my_space #toolbar a[href$="course.php"]::after{content:"Cursos"}
.section-session_my_space #toolbar a[href$="session.php"]::after{content:"Sesiones"}
.section-session_my_space #toolbar a[href$="company_reports.php"]::after{content:"Informe empresa"}
.section-session_my_space #toolbar a[href*="company_reports_resumed.php"]::after{content:"Informe resumido"}
.section-session_my_space #toolbar a[href*="export=csv"]::after{content:"Exportar CSV"}
.section-session_my_space #toolbar a[href^="javascript"]::after{content:"Imprimir"}
.section-session_my_space #toolbar a[href="index.php"]::after{content:"Volver"}
/* Botón de Claude (lo añade el plugin «claude_informes») */
#toolbar a.claude-ia-btn,#toolbar-agenda a.claude-ia-btn{border-color:#d97757 !important;background:linear-gradient(180deg,#fff,#fdf3ee) !important}
#toolbar a.claude-ia-btn:hover{background:#fbe6dc !important;border-color:#c15f3c !important;box-shadow:0 6px 14px rgba(217,119,87,.28) !important}
#toolbar a.claude-ia-btn::after{content:none !important}

/* ===== VISTA GLOBAL DE INFORMES: cajas con borde dorado ===== */
.view-global-followed .card,.view-global .panel-view,.report-section .panel{background:#fff;border:var(--dorado-grosor) solid var(--dorado) !important;border-radius:16px !important;box-shadow:0 0 0 4px color-mix(in srgb,var(--dorado) 12%,transparent),0 6px 18px rgba(17,24,39,.07) !important;overflow:hidden;transition:transform .2s,box-shadow .2s}
.view-global-followed .card{margin-bottom:20px;padding:4px 2px}
.view-global-followed .card:hover,.report-section .panel:hover{transform:translateY(-3px);box-shadow:0 0 0 4px color-mix(in srgb,var(--dorado) 22%,transparent),0 12px 26px rgba(17,24,39,.12) !important}
.view-global-followed .card .card-title a{color:var(--marca);font-weight:700}
.view-global-followed .card .icon-big{color:var(--dorado)}
.report-section .item-report{margin-bottom:20px}

/* ===== CAJAS DE ESTUDIANTES (Informes): borde azul ===== */
.report-section .panel{border:var(--dorado-grosor) solid var(--marca) !important;box-shadow:0 0 0 4px color-mix(in srgb,var(--marca) 10%,transparent),0 6px 18px rgba(17,24,39,.07) !important}
.report-section .panel:hover{box-shadow:0 0 0 4px color-mix(in srgb,var(--marca) 20%,transparent),0 12px 26px rgba(17,24,39,.12) !important}
.report-section .item-report-number{color:var(--marca);font-weight:700}

/* ===== INFORMES: TEXTOS EN DOS LINEAS y botón «Interfaz profesor» (sin enlace cuando es la vista actual) ===== */
.section-session_my_space #toolbar>.row>div>a::after{white-space:pre-line;min-height:2.4em;display:flex !important;align-items:flex-start;justify-content:center}
.section-session_my_space #toolbar>.row>div>a{cursor:pointer}
.section-session_my_space #toolbar>.row>div>a:not([href]){background:color-mix(in srgb,var(--marca) 10%,#fff);border-color:var(--marca);cursor:default}
.section-session_my_space #toolbar>.row>div>a:not([href])::after{content:"Interfaz\A profesor";color:var(--marca)}
.section-session_my_space #toolbar a[href*="my_progress.php"]::after{content:"Mis\A estadísticas"}
.section-session_my_space #toolbar a[href*="certificate_report.php"]::after{content:"Certificados\A del curso"}
.section-session_my_space #toolbar a[href=""]::after,.section-session_my_space #toolbar a[href*="view=teacher"]::after{content:"Interfaz\A profesor"}
.section-session_my_space #toolbar a[href*="admin_view.php"]::after{content:"Interfaz\A administrador"}
.section-session_my_space #toolbar a[href*="tracking/exams.php"]::after{content:"Seguimiento\A exámenes"}
.section-session_my_space #toolbar a[href*="current_courses.php"]::after{content:"Cursos\A actuales"}
.section-session_my_space #toolbar a[href*="session_filter.php"]::after{content:"Filtro\A certificados"}
.section-session_my_space #toolbar a[href*="learning_calendar"]::after{content:"Calendario\A aprendizaje"}
.section-session_my_space #toolbar a[href*="student.php"]::after{content:"Estudiantes\A seguidos"}
.section-session_my_space #toolbar a[href*="teachers.php"]::after{content:"Profesores\A seguidos"}
.section-session_my_space #toolbar a[href$="course.php"]::after{content:"Cursos\A seguidos"}
.section-session_my_space #toolbar a[href$="session.php"]::after{content:"Sesiones\A seguidas"}
.section-session_my_space #toolbar a[href$="company_reports.php"]::after{content:"Informe\A empresa"}
.section-session_my_space #toolbar a[href*="company_reports_resumed.php"]::after{content:"Informe\A resumido"}
.section-session_my_space #toolbar a[href*="export=csv"]::after{content:"Exportar\A CSV"}
.section-session_my_space #toolbar a[href^="javascript"]::after{content:"Imprimir\A informe"}
.section-session_my_space #toolbar a[href="index.php"]::after{content:"Volver\A atrás"}
/* Botón Claude: misma altura de dos líneas */
#toolbar a.claude-ia-btn .ci-lbl{min-height:2.4em;white-space:pre-line}

/* ===== BOTÓN «CLAUDE IA INFORMES» SIEMPRE VISIBLE EN INFORMES =====
   Sin el plugin aparece como botón inactivo (atenuado). Al activar el plugin «claude_informes»,
   el plugin coloca el botón real y este marcador se oculta automáticamente. */
.section-session_my_space #toolbar>.row>div:first-child::after{content:"Claude IA\A Informes";white-space:pre-line;display:inline-flex;justify-content:center;align-items:flex-start;box-sizing:border-box;width:96px;min-height:calc(2.4em + 52px);padding:45px 4px 7px;border:1.5px dashed #d97757;border-radius:12px;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2032%2032%22%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2216%22%20r%3D%2215%22%20fill%3D%22%23d97757%22/%3E%3Cg%20stroke%3D%22%23fff%22%20stroke-width%3D%222.4%22%20stroke-linecap%3D%22round%22%3E%3Cline%20x1%3D%228.0%22%20y1%3D%2216.0%22%20x2%3D%2224.0%22%20y2%3D%2216.0%22/%3E%3Cline%20x1%3D%229.1%22%20y1%3D%2212.0%22%20x2%3D%2222.9%22%20y2%3D%2220.0%22/%3E%3Cline%20x1%3D%2212.0%22%20y1%3D%229.1%22%20x2%3D%2220.0%22%20y2%3D%2222.9%22/%3E%3Cline%20x1%3D%2216.0%22%20y1%3D%228.0%22%20x2%3D%2216.0%22%20y2%3D%2224.0%22/%3E%3Cline%20x1%3D%2220.0%22%20y1%3D%229.1%22%20x2%3D%2212.0%22%20y2%3D%2222.9%22/%3E%3Cline%20x1%3D%2222.9%22%20y1%3D%2212.0%22%20x2%3D%229.1%22%20y2%3D%2220.0%22/%3E%3C/g%3E%3C/svg%3E") no-repeat center 8px/32px 32px,linear-gradient(180deg,#fff,#fdf3ee);color:#c15f3c;font-size:11.5px;font-weight:700;line-height:1.2;text-align:center;opacity:.55;filter:grayscale(.35);cursor:not-allowed}
.section-session_my_space #toolbar>.row>div:first-child:has(a.claude-ia-btn)::after{display:none}

/* ===== AJUSTE FILA INFORMES: «Imprimir» se mantiene a la derecha en la misma fila ===== */
.section-session_my_space #toolbar>.row>div:first-child{flex:1 1 0% !important;min-width:0}
.section-session_my_space #toolbar>.row>div:last-child:not(:first-child){flex:0 0 auto !important}
.section-session_my_space #toolbar>.row>div>a::after{max-width:100%;overflow-wrap:anywhere}

/* ===== VISTA GLOBAL ALINEADA: cajas de igual altura, título en 2 líneas, ícono y número centrados ===== */
.view-global-followed>.row{display:grid !important;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:20px;margin:0 0 20px}
.view-global-followed>.row::before,.view-global-followed>.row::after{display:none}
.view-global-followed>.row>div{display:flex;margin:0;padding:0;width:auto;float:none}
.view-global-followed .card{flex:1 1 auto;display:flex;flex-direction:column;margin-bottom:0 !important;min-height:170px}
.view-global-followed .card .content{flex:1;display:flex;flex-direction:column;justify-content:flex-start;gap:8px;padding:16px 14px 20px !important}
.view-global-followed .card .card-title{display:flex !important;align-items:center;justify-content:center;height:2.8em;min-height:2.8em;padding:0 !important;margin-bottom:12px;font-size:13.5px;line-height:1.3;text-align:center}
.view-global-followed .card .content>.row{display:flex;align-items:center;justify-content:center;gap:16px;margin:0}
.view-global-followed .card .content>.row>div{width:auto;float:none;padding:0}
.view-global-followed .card .icon-big{margin:0 !important;width:64px;height:64px;min-height:0;font-size:2.2em;display:flex;align-items:center;justify-content:center}
.view-global-followed .card .icon-big i{line-height:1 !important}
.view-global-followed .card .numbers{text-align:center !important;min-width:56px}
.view-global-followed .card .numbers h2{margin:0 !important;font-size:3em;line-height:1;color:var(--marca) !important;font-weight:700}

/* Botones bajo los gráficos circulares (Usuarios seguidos, Cursos asignados…): todos iguales */
.view-global .panel-view .row{display:flex;flex-wrap:wrap}
.view-global .panel-view .row>div{display:flex;flex-direction:column;align-items:center}
.view-global .easypiechart-link .btn{display:inline-flex;align-items:center;justify-content:center;width:170px;min-height:44px;white-space:normal;line-height:1.2;border:1.5px solid var(--boton-borde,#9ca3af);border-radius:12px;font-weight:600;margin-top:10px}
.view-global .easypiechart-link .btn:hover{border-color:var(--marca);color:var(--marca);background:color-mix(in srgb,var(--marca) 8%,#fff)}
.view-global .panel-view .btn-sm{margin-top:8px;border-radius:999px;width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;padding:0}

/* ===== VISTA GLOBAL INFERIOR EN TARJETAS: 4 tarjetas simétricas con las de arriba =====
   Orden en cada tarjeta: título (enlace) arriba · gráfico con el número al centro · botón «+» abajo */
.view-global .panel-view{background:transparent !important;border:0 !important;box-shadow:none !important;padding:0 !important;margin:0 0 20px}
.view-global .panel-view:hover{transform:none !important}
.view-global .panel-view>.panel-body{padding:0 !important}
.view-global .panel-view .row{display:grid !important;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:20px;margin:0 !important}
.view-global .panel-view .row::before,.view-global .panel-view .row::after{display:none !important}
.view-global .panel-view .row>div{width:auto !important;float:none !important;display:flex !important;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;padding:16px 14px 18px !important;background:#fff;border:var(--dorado-grosor) solid var(--dorado);border-radius:16px;box-shadow:0 0 0 4px color-mix(in srgb,var(--dorado) 12%,transparent),0 6px 18px rgba(17,24,39,.07);transition:transform .2s,box-shadow .2s}
.view-global .panel-view .row>div:hover{transform:translateY(-3px);box-shadow:0 0 0 4px color-mix(in srgb,var(--dorado) 22%,transparent),0 12px 26px rgba(17,24,39,.12)}
.view-global .easy-donut{display:flex;flex-direction:column;align-items:center;width:100%}
/* Título arriba, igual que las tarjetas superiores */
.view-global .easypiechart-link{order:-1;display:flex !important;align-items:center;justify-content:center;height:2.8em;padding:0 !important;margin:0 0 4px;width:100%}
.view-global .easypiechart-link .btn{all:unset;cursor:pointer;color:var(--marca);font-weight:700;font-size:13.5px;line-height:1.3;text-align:center}
.view-global .easypiechart-link .btn:hover{text-decoration:underline}
/* Gráfico y número centrados */
.view-global .easypiechart{margin:4px auto 6px !important}
.view-global .easypiechart .percent{top:0 !important;height:120px;line-height:120px;font-size:34px !important;font-weight:700;left:0}
/* Botón «+» abajo, redondo */
.view-global .panel-view .row>div>.btn-sm{margin-top:auto !important;width:36px;height:36px;border-radius:50% !important;display:inline-flex !important;align-items:center;justify-content:center;padding:0 !important;border:1.5px solid var(--boton-borde,#9ca3af);color:var(--marca);background:#fff}
.view-global .panel-view .row>div>.btn-sm:hover{background:var(--marca);border-color:var(--marca);color:#fff}
