Card with state based icon not working

I have been trying different versions of this for days. I can’t seem to get consistent results that work for making a state based icon. The examples I find online don’t work as is. Can someone help me figure out why my icon is not working?? Specifically the last line of code. You can see all the versions of it I have tried in the commented lines above it. The only line that works is the one that defines icon directly. I can’t seem to get any state based version to work, It always results in no icon at all. TIA!!

#
type: entities
entities:
  - type: custom:config-template-card
    variables:
      - MODE1:states['select.alarm_current_mode'].state
      - states['select.alarm_current_mode'].state
      - MODE2:"armed"
      - states['select.alarm_current_mode'].state
      - ARMED:"disarmed"
    entities:
      - select.alarm_current_mode
    row:
      type: section
      #icon: mdi:alarm-light-off 
      #label: '${vars[1] === "disarmed" ? "Disarmed" : "ARMED!!"}'
      label: "${vars[0] === 'disarmed' ? 'Disarmed' : 'ARMED!!'}"
      #label: "${MODE1 === "disarmed" ? "Disarmed" : "ARMED!!"}"
      #label: '${ select.alarm_current_mode === ''disarmed'' ? ''Disarmed'' : ''ARMED!!''}'
      #icon: mdi:alarm-light-off 
  - type: custom:config-template-card
    variables:
      - states['select.alarm_current_mode'].state
      - MODE3:"disarmed"
      - MODE4:"armed"
    entities:
      - select.alarm_current_mode
    row:
      type: section
      #icon: mdi:alarm-light-off 
      #label: "${vars[0] === 'disarmed' ? 'Disarmed' : 'ARMED!!'}"
      #label: '${ MODE1 === ''disarmed'' ? ''Disarmed'' : ''ARMED!!''}'
      label: "${ states['select.alarm_current_mode'].state === 'disarmed' ? 'Disarmed' : 'ARMED!!'}"
      #icon: mdi:alarm-light-off 
  - entity: select.alarm_current_mode
    variables:
      - states['select.alarm_current_mode'].state
    #icon: mdi:alarm-light-off
    #icon: '${ states['select.alarm_current_mode'].state === ''disarmed'' ? ''mdi:alarm-light-off-outline'' : ''mdi:alarm-light''}' 
    #icon: '${ state === ''disarmed'' ? ''mdi:alarm-light-off-outline'' : ''mdi:alarm-light''}'     
    icon: "${ states['select.alarm_current_mode'].state === 'disarmed' ? 'mdi:alarm-light-off' : 'mdi:alarm-light'}"
    #

BTW, if anyone can point me to a good overview of cards, the different types, and templates, that would be great! I have found a lot online, but most contain examples that don’t work, or don’t address this issue.

  1. The config-template-card (CTC) allows to use templates to define EXISTING options in the internal card (or row, or element- check Docs in GitHub for CTC). What you are trying to do here is defining a NOT EXISTING option - the “icon” option is not available for the “section” row.
  2. Variables in CTC are defined with errors. For details and any other issues with CTC - go to the already present dedicated long CTC thread (“share your project” section).