﻿/* =========================================
   AlphaWells — Theme v2 Buttons 
   ========================================= */

:root {
    /* uses existing Theme v2 tokens */
    --aw-btn-height: 38px;
    --aw-btn-radius: 6px;
    --aw-btn-gap: 10px;
    --aw-btn-pad-x: 16px;
    --aw-btn-border: 1px solid transparent;
    --aw-btn-text: #FFFFFF;
}

/* Base */
.btn-aw {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--aw-btn-gap);
    min-height: var(--aw-btn-height);
    padding: 0 var(--aw-btn-pad-x);
    border-radius: var(--aw-btn-radius);
    border: var(--aw-btn-border);
    font-family: var(--aw-font-sans);
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1;
    color: var(--aw-btn-text);
    box-shadow: 0 1px 2px rgba(0,0,0,.05);
    transition: transform .05s ease, box-shadow .2s ease, opacity .2s ease;
    text-transform: none; /* defeat old uppercase */
    text-decoration: none !important;
}

    /* Override Bootstrap link states to maintain button text color */
    .btn-aw:link,
    .btn-aw:visited,
    .btn-aw:hover,
    .btn-aw:active,
    .btn-aw:focus {
        color: var(--aw-btn-text) !important;
    }

    /* Icon sizing (Font Awesome) */
    .btn-aw i,
    .btn-aw .fa,
    .btn-aw .fas,
    .btn-aw .far {
        font-size: 1.05rem;
        line-height: 1;
    }

/* Variants from Theme v2 tokens */
.btn-aw--primary { /* Actions Dashboard, primary actions */
    background: #0d6efd; /* Bootstrap primary blue */
}

    .btn-aw--primary:hover {
        background: #0b5ed7;
        color: #fff !important;
    }

.btn-aw--secondary {
    background: #6c757d; /* Bootstrap secondary gray */
}

    .btn-aw--secondary:hover {
        background: #5c636a;
        color: #fff !important;
    }

.btn-aw--warning {
    background: #ffc107; /* Bootstrap warning yellow */
    color: #212529;
}

    .btn-aw--warning:hover {
        background: #e0a800;
        color: #212529 !important;
    }

.btn-aw--success { /* "Create New" */
    background: var(--aw-green-500); /* #6EB17E */
}

    .btn-aw--success:hover {
        background: var(--aw-green-600, #5D9F70);
        color: #fff !important; /* Override Bootstrap link hover color */
    }

.btn-aw--apply {
    background: #E9A93D; /* warm amber */
    border: 1px solid transparent;
    color: #fff;
}

    .btn-aw--apply:hover {
        background: #D99934; /* a shade darker on hover */
        color: #fff !important; /* Override Bootstrap link hover color */
    }

.btn-aw--teal { /* “Deleted Items” */
    background: var(--aw-teal-700); /* #1A4E63 */
}

    .btn-aw--teal:hover {
        background: var(--aw-teal-800, #153F50);
        color: #fff !important; /* Override Bootstrap link hover color */
    }

/* States */
.btn-aw:hover {
    opacity: .95;
}

.btn-aw:active {
    transform: translateY(1px);
}

.btn-aw:disabled,
.btn-aw[disabled] {
    opacity: .6;
    cursor: not-allowed;
}

/* Focus ring: visible on both light/dark */
.btn-aw:focus-visible {
    outline: 2px solid rgba(255,255,255,.75);
    outline-offset: 2px;
}

/* Size helpers (optional) */
.btn-aw--sm {
    min-height: 38px;
    padding: 0 16px;
    border-radius: 6px;
}

.btn-aw--lg {
    min-height: 52px;
    padding: 0 26px;
    border-radius: 8px;
}

/* Bootstrap size variants */
/* --- Bootstrap mapping (optional, makes old markup look new) --- */ 
.btn.btn-success,
.btn.btn-secondary {
    /* adopt the new silhouette */
    height: var(--aw-btn-height);
    padding: 0 var(--aw-btn-pad-x);
    border-radius: var(--aw-btn-radius);
    border: var(--aw-btn-border);
    font-weight: 600;
    text-transform: none;
    color: var(--aw-btn-text);
}

    /* Override Bootstrap link hover states for mapped buttons */
    .btn.btn-success:hover,
    .btn.btn-success:focus,
    .btn.btn-secondary:hover,
    .btn.btn-secondary:focus {
        color: var(--aw-btn-text) !important;
    }

/* Map colors to tokens */
.btn.btn-success {
    background: var(--aw-green-500) !important;
    border-color: #fff !important;
}

.btn.btn-secondary {
    background: var(--aw-teal-700) !important;
    border-color: #fff !important;
}

/* Neutralize older layers that forced different looks inside .main-content */
.main-content .btn {
    text-transform: none;
}

