/* ND369 — Shared action buttons (Call / Zalo) */
/* Container ch?a c?c n?t */
.nd369-action-group {
    display: flex;
    gap: 10px; /* Kho?ng c?ch gi?a 2 n?t */
    margin-bottom: 20px;
    flex-wrap: wrap; /* T? xu?ng d?ng tr?n m?n h?nh si?u nh? */
}

/* Style chung cho n?t */
.nd369-btn {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 12px 20px;
    border-radius: 8px;
    text-decoration: none !important;
    font-weight: bold;
    flex: 1; /* Chia ??u chi?u r?ng */
    transition: transform 0.2s;
    text-align: center;
    color: #fff !important;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

.nd369-btn:hover {
    transform: translateY(-2px); /* Hi?u ?ng nh?c n?t l?n khi di chu?t */
    box-shadow: 0 6px 10px rgba(0,0,0,0.15);
}

.nd369-btn span {
    font-size: 18px;
    text-transform: uppercase;
    line-height: 1.2;
}

.nd369-btn small {
    font-size: 12px;
    font-weight: normal;
    opacity: 0.9;
    margin-top: 4px;
}

/* M?u n?t G?i (?? ho?c Cam - T?o c?m gi?c g?p) */
.btn-call {
    background: linear-gradient(to bottom, var(--accent-color), var(--secondary-color));
    border: 1px solid var(--secondary-color);
}

/* M?u n?t Zalo (Xanh Zalo chu?n) */
.btn-zalo {
    background: linear-gradient(to bottom, #0088ff, #0055cc);
    border: 1px solid #0055cc;
}

/* D?ng ch? uy t?n b?n d??i */
.nd369-trust-badge {
    font-size: 14px;
    color: #2e7d32; /* M?u xanh l? c?y tin c?y */
    margin-top: 10px;
    font-weight: 500;
}

/* --- T?I ?U CHO MOBILE (QUAN TR?NG) --- */
@media (max-width: 480px) {
    .nd369-action-group {
        flex-direction: column; /* X?p ch?ng l?n nhau tr?n ?i?n tho?i */
    }
    
    .nd369-btn {
        width: 100%; /* N?t r?ng full m?n h?nh */
        padding: 15px; /* N?t to h?n ?? d? b?m */
    }
}