/* assets/css/executive_actions.css */
/* Unified styles for CEO Executive Action Buttons (Circular Design) */

.executive-actions-row {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    margin-bottom: 25px;
    padding: 10px 15px; /* Increased padding to allow scaling without overflow */
    overflow-x: auto;
    overflow-y: visible !important; /* Ensure icons are not cut vertically when scaling */
    -webkit-overflow-scrolling: touch;
}

/* Hide scrollbar for Chrome, Safari and Opera */
.executive-actions-row::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.executive-actions-row {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.doc-util-btn, .ai-util-btn {
    background: #ffffff;
    color: #000000;
    min-width: 48px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex; 
    align-items: center; 
    justify-content: center;
    font-size: 11px; 
    font-weight: 800; 
    cursor: pointer; 
    border: 3px solid #0f172a;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    padding: 0;
    flex-shrink: 0;
    text-transform: uppercase;
    font-family: inherit;
}

.doc-util-btn:hover, .ai-util-btn:hover {
    transform: scale(1.1);
    background: #f8f9fa;
    box-shadow: 0 6px 15px rgba(0,0,0,0.15);
}


/* MIC Pulse when AI is active */
.ai-util-btn.session-active {
    border-color: #ff3b30;
    box-shadow: 0 0 15px rgba(255, 59, 48, 0.4);
    animation: pulse-mic-exec 2s infinite;
}

@keyframes pulse-mic-exec {
    0% { transform: scale(1); }
    70% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

/* Mobile Adjustments (iPhone/iOS) */
@media (max-width: 768px) {
    .executive-actions-row {
        gap: 8px;
    }
    .doc-util-btn, .ai-util-btn {
        width: 44px;
        height: 44px;
        min-width: 44px;
        font-size: 10px;
        border-width: 2.5px;
    }
    .ai-util-btn svg {
        width: 20px !important;
        height: 20px !important;
    }
}

/* 2026-10: palabras en lugar de siglas (CEO, CAI, DOC…): botones en píldora */
.doc-util-btn.word-btn, .ai-util-btn.word-btn {
    width: auto; min-width: 0; height: 44px; border-radius: 999px; padding: 0 16px;
    font-size: 13.5px; font-weight: 700; text-transform: none; border-width: 1.5px; border-color: #CBD3E1;
    color: #0E1A2B; gap: 8px; white-space: nowrap; box-shadow: none;
}
.ai-util-btn.word-btn { background: #0B1730; color: #FFFFFF; border-color: #0B1730; }
html[data-ceo-scope="hogar"] .ai-util-btn.word-btn, .ai-util-btn.word-btn.is-home { background: #0F3D3A; border-color: #0F3D3A; }
.doc-util-btn.word-btn:hover, .ai-util-btn.word-btn:hover { transform: translateY(-1px); }
@media (max-width: 768px) {
    .doc-util-btn.word-btn, .ai-util-btn.word-btn { width: auto; min-width: 0; height: 44px; font-size: 13px; padding: 0 14px; }
}

/* CAI (Chief Artificial Intelligence): el Manifiesto que la IA cumple siempre. Segundo botón y destacado. */
.doc-util-btn.word-btn.word-btn-cai { background: #FFFFFF; color: #0B1730; border: 2px solid #0B1730; font-weight: 800; }
.doc-util-btn.word-btn.word-btn-cai::before { content: '⚖'; font-size: 15px; line-height: 1; }
html[data-ceo-scope="hogar"] .doc-util-btn.word-btn.word-btn-cai { color: #0F3D3A; border-color: #0F3D3A; }
