.goal-page { --goal-ink: #123f37; --goal-green: #086b5b; --goal-lime: #dff56c; --goal-line: #c8dad3; padding-bottom: 76px; }
.goal-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; margin-bottom: 24px; padding: 30px 34px; border: 1px solid var(--goal-line); border-radius: 28px; background: radial-gradient(circle at 92% 6%, rgba(223,245,108,.32), transparent 24%), linear-gradient(125deg, #fafff9 0%, #e4f4ec 100%); box-shadow: 0 18px 48px rgba(10,73,61,.09); }
.goal-kicker { color: #167665; font-size: 10px; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.goal-hero h1 { margin: 7px 0 8px; color: var(--goal-ink); font: 400 clamp(38px,5vw,62px)/.96 "DM Serif Display", Georgia, serif; }
.goal-hero p { max-width: 720px; margin: 0; color: #607a73; font-size: 14px; line-height: 1.65; }
.goal-hero-actions,.goal-modal footer,.goal-card footer { display: flex; flex-wrap: wrap; gap: 10px; }
.goal-btn { min-height: 43px; border: 1px solid transparent; border-radius: 13px; padding: 0 17px; font: 800 12px Manrope,sans-serif; cursor: pointer; transition: transform .15s, box-shadow .15s, background .15s; }
.goal-btn:hover { transform: translateY(-1px); }.goal-btn.primary { background: var(--goal-green); color: #fff; box-shadow: 0 10px 22px rgba(8,107,91,.17); }.goal-btn.secondary { border-color: #bcd1ca; background: #fff; color: #17574c; }.goal-btn.outline { border-color: #d9a529; background: #fff9e5; color: #77590a; }.goal-btn.danger-outline { border-color: #e5b4a8; background: #fff8f5; color: #b34835; }
.goal-metrics { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; margin-bottom: 18px; }
.goal-metrics article { display: grid; align-content: center; min-height: 128px; box-sizing: border-box; border: 1px solid #d0dfda; border-radius: 20px; padding: 20px 22px; background: #fffef9; box-shadow: 0 11px 28px rgba(17,68,58,.055); }.goal-metrics article.featured { border-color: #146f5e; background: linear-gradient(145deg,#0b594d,#197766); color: #fff; }.goal-metrics article.ready { background: linear-gradient(145deg,#fff9e7,#fffdf5); }
.goal-metrics span { color: #647a75; font-size: 11px; font-weight: 700; }.goal-metrics .featured span,.goal-metrics .featured small { color: #cbe2db; }.goal-metrics strong { margin: 7px 0 4px; color: var(--goal-ink); font: 400 31px "DM Serif Display",serif; }.goal-metrics .featured strong { color: #fff; }.goal-metrics small { color: #788b86; font-size: 10px; }
.goal-rule { display: flex; align-items: center; gap: 15px; margin-bottom: 28px; border: 1px solid #c6d9d1; border-radius: 18px; padding: 17px 20px; background: #f1f8f4; }.goal-rule-icon { display: grid; place-items: center; width: 38px; height: 38px; flex: 0 0 auto; border-radius: 12px; background: var(--goal-lime); color: #0a574a; font-weight: 900; }.goal-rule strong { color: #17483f; }.goal-rule p { margin: 3px 0 0; color: #657b75; font-size: 12px; line-height: 1.5; }
.goal-list-section,.goal-requests-section { border: 1px solid #cfddd8; border-radius: 24px; background: rgba(255,254,249,.86); box-shadow: 0 16px 40px rgba(14,66,56,.07); overflow: hidden; }.goal-list-section > header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 24px; border-bottom: 1px solid #dae5e1; }.goal-list-section h2,.goal-requests-section h2 { margin: 4px 0 0; color: var(--goal-ink); font: 400 27px "DM Serif Display",serif; }
.goal-search { display: flex; align-items: center; gap: 9px; min-width: min(370px,100%); border: 1px solid #c8d8d3; border-radius: 13px; padding: 0 14px; background: #fff; }.goal-search input { width: 100%; height: 43px; border: 0; outline: 0; color: #214b43; font: 600 12px Manrope,sans-serif; }
.goal-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; padding: 20px; }
.goal-card { display: flex; flex-direction: column; min-height: 330px; box-sizing: border-box; border: 1px solid #c9dad4; border-radius: 21px; padding: 21px; background: linear-gradient(145deg,#fffefa,#f5faf7); }.goal-card.disponible { border-color: #d7b442; background: linear-gradient(145deg,#fffef8,#fff5cf); }.goal-card.cerrada { opacity: .76; background: #f2f4f2; }.goal-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; }.goal-account { color: #187464; font-size: 9px; font-weight: 800; letter-spacing: .12em; }.goal-card h2 { margin: 5px 0 3px; color: var(--goal-ink); font: 400 27px/1.05 "DM Serif Display",serif; }.goal-card header p { margin: 0; color: #71847f; font-size: 10px; }
.goal-status { display: inline-flex; align-items: center; min-height: 25px; border-radius: 999px; padding: 0 10px; white-space: nowrap; font-size: 9px; font-weight: 800; text-transform: uppercase; }.goal-status.active { background: #e5f4ec; color: #176d59; }.goal-status.available { background: #f8df7b; color: #674c00; }.goal-status.pending { background: #ffe9da; color: #a94a31; }.goal-status.closed { background: #e4e9e7; color: #61716d; }
.goal-date { display: grid; gap: 2px; margin: 18px 0 14px; border-left: 3px solid #d7e869; padding-left: 13px; }.goal-date span,.goal-money span { color: #738680; font-size: 9px; font-weight: 700; text-transform: uppercase; }.goal-date strong { color: #254f47; font-size: 13px; }.goal-date small { color: #83938f; font-size: 9px; }
.goal-money { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }.goal-money > div { display: grid; gap: 5px; border: 1px solid #dbe5e1; border-radius: 13px; padding: 11px; background: rgba(255,255,255,.76); }.goal-money strong { color: #244e46; font-size: 14px; }.goal-money .total { border-color: #a9cbbf; background: #eaf6f0; }.goal-money .total strong { color: #075c4d; }
.goal-progress { margin: 15px 0 0; }.goal-progress > div { display: flex; justify-content: space-between; color: #60756f; font-size: 9px; }.goal-progress i { display: block; height: 7px; margin: 6px 0 4px; overflow: hidden; border-radius: 99px; background: #e2eae6; }.goal-progress b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#1a8a72,#dced61); }.goal-progress small { color: #84938f; font-size: 9px; }.goal-card footer { align-items: flex-end; margin-top: auto; padding-top: 17px; }.goal-card-note { color: #748782; font-size: 10px; }
.goal-requests-section { margin-top: 24px; }.goal-requests-section > header { padding: 22px 24px 12px; }.goal-requests-section header p { margin: 3px 0 0; color: #6c807a; font-size: 11px; }.goal-requests { display: grid; gap: 10px; padding: 12px 20px 20px; }.goal-request { display: flex; align-items: center; justify-content: space-between; gap: 20px; border: 1px solid #ead9c3; border-radius: 16px; padding: 16px 18px; background: #fffbf4; }.goal-request h3 { margin: 7px 0 2px; color: #20483f; font-size: 14px; }.goal-request p { margin: 0 0 4px; color: #657a74; font-size: 11px; }.goal-request small { color: #82908d; font-size: 9px; }.goal-request-actions { display: flex; gap: 8px; }.goal-request-wait { color: #8a6916; font-size: 10px; font-weight: 800; }
.goal-empty { grid-column: 1/-1; display: grid; place-items: center; min-height: 220px; text-align: center; color: #607770; }.goal-empty strong { color: #1b4b42; font-size: 17px; }.goal-empty p { margin: 4px 0; font-size: 11px; }.goal-loading { display: grid; place-items: center; min-height: 55vh; color: #58736c; font-weight: 700; }
.goal-modal { width: min(680px,100%); }.goal-form-columns { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }.goal-form label small { color: #82938e; font-weight: 600; }.goal-date-presets { display: flex; flex-wrap: wrap; gap: 7px; margin-top: -8px; }.goal-date-presets button { border: 1px solid #c6d8d1; border-radius: 99px; padding: 7px 11px; background: #f5faf7; color: #236157; font: 700 10px Manrope,sans-serif; cursor: pointer; }.goal-form-note { display: grid; gap: 3px; border-left: 4px solid #d8e957; border-radius: 10px; padding: 13px 15px; background: #f6fae9; }.goal-form-note strong { color: #375a1d; font-size: 11px; }.goal-form-note span { color: #667a5a; font-size: 10px; line-height: 1.45; }.goal-operation-summary,.goal-rate-summary { display: grid; gap: 3px; border: 1px solid #c8ddd5; border-radius: 16px; padding: 17px; background: #edf7f2; }.goal-operation-summary.early { border-color: #ead0b8; background: #fff7ed; }.goal-operation-summary span,.goal-rate-summary span { color: #6b7f79; font-size: 9px; font-weight: 800; text-transform: uppercase; }.goal-operation-summary strong,.goal-rate-summary strong { color: #104b40; font: 400 25px "DM Serif Display",serif; }.goal-operation-summary small,.goal-rate-summary small { color: #71837e; font-size: 10px; }.goal-receipt > p { margin: -12px 0 17px; color: #617a73; }
@media (max-width: 1120px) { .goal-metrics { grid-template-columns: repeat(2,1fr); }.goal-grid { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .goal-hero { align-items: flex-start; flex-direction: column; padding: 24px 20px; }.goal-hero-actions { width: 100%; }.goal-hero-actions .goal-btn { flex: 1; }.goal-metrics { grid-template-columns: 1fr; }.goal-list-section > header,.goal-request { align-items: stretch; flex-direction: column; }.goal-search { min-width: 0; width: 100%; box-sizing: border-box; }.goal-grid { padding: 12px; }.goal-money { grid-template-columns: 1fr; }.goal-form-columns { grid-template-columns: 1fr; }.goal-request-actions .goal-btn { flex: 1; } }