/* Pesantren Bootstrap Theme - Bani Hasbulloh Said */
:root {
  --pesantren-primary: #006400; /* Dark Islamic green */
  --pesantren-secondary: #228B22; /* Forest green */
  --pesantren-light: #90EE90; /* Light green */
  --pesantren-gold: #DAA520; /* Gold accent */
  --pesantren-dark: #004d00;
}

*{margin:0;padding:0;box-sizing:border-box;font-family:'Poppins',sans-serif;}

body{
    background:linear-gradient(180deg,var(--pesantren-dark),var(--pesantren-primary),var(--pesantren-secondary));
    min-height:100vh;
    padding:20px;
    color:#033;
}

.container{
    max-width:900px;
    margin:0 auto;
}

/* Header */
.header{
    text-align:center;
    color:white;
    margin-bottom:40px;
    padding:40px 20px;
    background:white;
    border-radius:20px;
    box-shadow:0 10px 30px rgba(0,0,0,0.15);
}

.header h1{
    color:var(--pesantren-gold);
    font-size:2.5rem;
    margin-bottom:10px;
}

.header p{
    color:#f0f0f0;
    font-size:1.1rem;
}

.title-divider{
    width:120px;
    height:3px;
    margin:14px auto 18px;
    background:linear-gradient(90deg,#1b6ca8,#0d3b66);
    border-radius:3px;
}

/* Navigation */
.nav{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:10px;
    margin-bottom:30px;
}

.nav a{
    display:inline-block;
    padding:12px 25px;
    background:white;
    color:var(--pesantren-primary);
    text-decoration:none;
    border-radius:50px;
    font-weight:600;
    box-shadow:0 4px 15px rgba(0,0,0,0.1);
    transition:.25s;
}

.nav a:hover{
    transform:translateY(-3px);
    box-shadow:0 8px 20px rgba(0,0,0,0.2);
    color:var(--pesantren-dark);
}

.btn-back{background:#6c757d !important;color:white !important;}
.btn-back:hover{background:#5a6268 !important;}
.btn-logout{background:#dc3545 !important;color:white !important;}
.btn-logout:hover{background:#c82333 !important;}

/* Bootstrap overrides for pesantren theme */
.btn-primary, .btn-submit {
    background-color: var(--pesantren-primary) !important;
    border-color: var(--pesantren-primary) !important;
}
.btn-primary:hover, .btn-submit:hover {
    background-color: var(--pesantren-dark) !important;
    border-color: var(--pesantren-dark) !important;
}
.btn-success {
    background-color: var(--pesantren-secondary) !important;
    border-color: var(--pesantren-secondary) !important;
}

/* Cards */
.card, .form-card, .search-box, .tree-container{
    background:white;
    border-radius:20px;
    padding:25px;
    margin-bottom:20px;
    box-shadow:0 10px 30px rgba(0,0,0,0.15);
}

/* Form Elements */
.form-group{margin-bottom:20px;}
.form-group label{display:block;margin-bottom:8px;color:#333;font-weight:600;}
.form-group input,.form-group select,.form-group textarea{
    width:100%;
    padding:12px 20px;
    border:2px solid #e0e0e0;
    border-radius:10px;
    font-size:1rem;
    outline:none;
    transition:all .3s;
}

.form-group input:focus,.form-group select:focus,.form-group textarea:focus{
    border-color:var(--pesantren-primary);
}

.btn-submit,.btn-primary{
    width:100%;
    padding:15px;
    background:#1b6ca8;
    color:white;
    border:none;
    border-radius:50px;
    font-size:1rem;
    font-weight:600;
    cursor:pointer;
    transition:all .3s;
}

.btn-submit:hover,.btn-primary:hover{
    background:#0d3b66;
}

.btn-secondary{
    background:#6c757d;
}
.btn-secondary:hover{
    background:#5a6268;
}

.btn-success{background:#28a745;}
.btn-success:hover{background:#218838;}
.btn-warning{background:#ffc107;color:#333;}
.btn-danger{background:#dc3545;color:white;}
.btn-danger:hover{background:#c82333;}

/* Search Form */
.search-form{display:flex;gap:10px;}
.search-form input{flex:1;padding:15px 20px;border:2px solid #e0e0e0;border-radius:50px;font-size:1rem;outline:none;}
.search-form input:focus{border-color:var(--pesantren-primary);}
.search-form button{padding:15px 30px;background:var(--pesantren-primary);color:white;border:none;border-radius:50px;font-weight:600;cursor:pointer;}
.search-form button:hover{background:var(--pesantren-dark);}

/* Results */
.results-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(250px,1fr));
    gap:15px;
}

.result-item,.person-card,.menu-card{
    display:block;
    padding:15px;
    background:#f8f9fa;
    border-radius:15px;
    text-decoration:none;
    color:#333;
    transition:.3s;
    border:2px solid transparent;
}

.result-item:hover,.person-card:hover,.menu-card:hover{
    border-color:var(--pesantren-primary);
    transform:translateY(-3px);
    box-shadow:0 5px 15px rgba(0,0,0,0.1);
}

/* Stats */
.stats-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:20px;
    margin-bottom:30px;
}

.stat-card{
    background:white;
    border-radius:20px;
    padding:30px;
    text-align:center;
    box-shadow:0 10px 30px rgba(0,0,0,0.1);
    transition:all .3s;
}

.stat-card:hover{
    transform:translateY(-5px);
    box-shadow:0 15px 40px rgba(0,0,0,0.15);
}

.stat-card .icon{font-size:3rem;margin-bottom:15px;}
.stat-card .number{font-size:2.5rem;font-weight:700;color:var(--pesantren-gold);margin-bottom:10px;}
.stat-card .label{color:#666;font-size:1rem;}

/* Menu Grid */
.menu-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
    gap:20px;
}

.menu-card{
    background:white;
    border-radius:20px;
    padding:25px;
    text-align:center;
    box-shadow:0 10px 30px rgba(0,0,0,0.1);
}

.menu-card:hover{
    transform:translateY(-8px);
    box-shadow:0 20px 40px rgba(0,0,0,0.2);
}

.menu-card .icon{font-size:2.5rem;margin-bottom:10px;}
.menu-card h3{color:var(--pesantren-primary);margin-bottom:10px;}
.menu-card p{color:#666;font-size:.9rem;}

/* Alerts */
.error{
    background:#fee;
    border-radius:10px;
    padding:12px;
    margin-bottom:20px;
    color:#c00;
    text-align:center;
}

.success{
    background:#efe;
    border-radius:10px;
    padding:12px;
    margin-bottom:20px;
    color:#28a745;
    text-align:center;
}

.info-box{
    background:#e6ffe6;
    border-radius:10px;
    padding:15px;
    margin-bottom:20px;
    color:var(--pesantren-primary);
    border-left:4px solid var(--pesantren-secondary);
}

.info-box strong{color:var(--pesantren-dark);}

/* Footer */
.footer{
    text-align:center;
    color:white;
    opacity:.8;
    margin-top:40px;
}

/* Table */
.table-container{overflow-x:auto;}
table{width:100%;border-collapse:collapse;}
th,td{padding:12px 15px;text-align:left;border-bottom:1px solid #eee;}
th{background:var(--pesantren-primary) !important;color:white;font-weight:600;}
tr:hover{background:#f8f9fa;}

/* Tree Styles */
.tree-container{overflow-x:auto;}
.tree ul{padding-top:20px;position:relative;transition:all .5s;display:flex;justify-content:center;gap:10px;}
.tree li{float:left;text-align:center;list-style-type:none;position:relative;padding:20px 10px 0 10px;transition:all .5s;}
.tree li::before,.tree li::after{content:'';position:absolute;top:0;right:50%;border-top:2px solid #ccc;width:50%;height:20px;}
.tree li::after{right:auto;left:50%;border-left:2px solid #ccc;}
.tree li:only-child::after,.tree li:only-child::before{display:none;}
.tree li:only-child{padding-top:0;}
.tree li:first-child::before,.tree li:last-child::after{border:0 none;}
.tree li:last-child::before{border-right:2px solid #ccc;border-radius:0 5px 0 0;}
.tree li:first-child::after{border-radius:5px 0 0 0;}
.tree ul ul::before{content:'';position:absolute;top:0;left:50%;border-left:2px solid #ccc;width:0;height:20px;}
.tree li a,.tree li span{display:inline-block;padding:15px 20px;background:linear-gradient(180deg,var(--pesantren-dark),var(--pesantren-primary));color:white;text-decoration:none;border-radius:15px;font-weight:600;transition:all .3s;border:2px solid transparent;cursor:pointer;min-width:100px;max-width:200px;font-size:.85rem;}
.tree li a:hover{background:white;color:var(--pesantren-primary);border-color:var(--pesantren-primary);transform:scale(1.05);box-shadow:0 5px 15px rgba(0,0,0,0.2);}
.tree li a.root-node{background:linear-gradient(135deg,var(--pesantren-gold),var(--pesantren-secondary));}
.tree li a.root-node:hover{border-color:var(--pesantren-gold);color:var(--pesantren-gold);}
.tree li ul{display:none;}
.tree li ul.show{display:flex;}

/* Login Page */
.login-container{max-width:400px;margin:50px auto;}
.login-card{background:white;border-radius:20px;padding:40px;box-shadow:0 20px 60px rgba(0,0,0,0.2);}
.login-card h2{color:var(--pesantren-primary);text-align:center;margin-bottom:30px;}
.login-card input{width:100%;padding:15px;margin-bottom:20px;border:2px solid #e0e0e0;border-radius:10px;font-size:1rem;}

/* Responsive */
@media (max-width:600px){
    .header h1{font-size:2rem;}
    .nav a{display:block;}
    .search-form{flex-direction:column;}
    .results-grid{grid-template-columns:1fr;}
}